Run VueJS app on Localhost
1 - npm run build
2 - copy the build dist folder or dist with index.html
3 - make a new folder in htdocs test
4 - go to localhost/test
If things don't work view source in a text editor and change paths of your src files and maybe add a base href. Your code shows /static/
I would replace
<script type=text/javascript src=/static/js/app.e5eb3a5fa6134479362c.js></script>
This to
<script type=text/javascript src="http://localhost/test/static/js/app.e5eb3a5fa6134479362c.js"></script>
Also check console errors.
Luiz Wynne
Updated on August 06, 2020Comments
-
Luiz Wynne almost 4 years
I've bee trying to run a simple VueJS application built with Vue CLI/Webpack into my localhost without having to use npm run dev, but only by accessing from my local server. I ran the npm run build and dragged the files into my htdocs on Mamp, but still it doesnt seem to work. This is my directory structure in the project:
This is my index.html in my root folder
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>demo</title> </head> <body> <div id="app"></div> <!-- built files will be auto injected --> </body> </html>
and this is the index.html in the dist folder
<!DOCTYPE html> <html> <head> <meta charset=utf-8> <meta name=viewport content="width=device-width,initial-scale=1"> <title>demo</title> <link href=/static/css/app.e1c36c05dd8e70649268723708cfb519.css rel=stylesheet> </head> <body> <div id="app"></div> <script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js> </script><script type=text/javascript src=/static/js/vendor.3fae27b6d0a0572472a3.js></script> <script type=text/javascript src=/static/js/app.e5eb3a5fa6134479362c.js></script> </body> </html>
What am i missing?
Thank you!