i need some help. I wrote an SPA using VueJs. I ran "npm run build" so i can test my app on my Xampp server. The build generated a "/dist" folder. I changed the index.html in the dist folder to index.php. I tried serving the dist folder with Xampp but it shows a blank page. Please help. I have uploaded the image showing the errors
Asked
Active
Viewed 2.2k times
3
-
Are there errors in the JavaScript console? – ceejayoz Sep 21 '17 at 14:56
-
Yes there are, it shows GET requests to the js files but they all failed. A 404 error code – okwuriki kelechi Sep 21 '17 at 15:03
-
That sounds like something you should fix, then. Figure out why those URLs aren't returning the files you expect. – ceejayoz Sep 21 '17 at 15:11
-
If i figured it out, i wouldn't post this question. Please help – okwuriki kelechi Sep 21 '17 at 15:34
-
1We can't help, because you haven't really provided any information. It's probably something simple like URLs that say `/dist/foo.js` but you've got them at `/foo.js` with your server config. – ceejayoz Sep 21 '17 at 15:35
-
@ceejayoz i've included an image showing the errors. – okwuriki kelechi Sep 21 '17 at 16:07
-
Go into the network panel, refresh, and see where your browser is trying to find those files. Then, take a look at your `dist` folder structure and figure out where the mis-match is. Your screenshot doesn't tell me much. – ceejayoz Sep 21 '17 at 16:09
2 Answers
1
I had the same issue; a bunch of 404's in my console after running
npm run build. Ceejayoz is correct in suggesting you take a look at your network tab to see where the server is expecting to reach the file.
His suggestion tipped me off that my application did not have a base URL set. Vue's docs on this.
After setting the path my app was located at, I reran the build process and it came right up.
user2305363
- 157
- 2
- 15
0
dist files can only be served via http, you have to deploy it to your hosting server before you can see the output of your vue app
Chidiebere Ezeka
- 33
- 1
- 3