Multi-level routing request JS file path not correct method

1, problem description

Recently started learning Vue for the reasons of the project, watched the tutorial for a few days and then began to masturbate the project. The process is also very smooth, the one-month project to go online when there is a problem-the history mode to open the site, from the navigation point to the specific content page is normal, but a Refresh content page is blank.

For example: Open the homepage of the website is normal http://localhost:8888/ Refresh also no problem.

With the mouse click, from the navigation bar to enter the merchant details page of an item is also normal http://localhost:8888/Business/ResetBusiness but refresh the next page is blank. The console error is as follows.

Point in the wrong view, the app.js is actually HTML code

How can this, HTML how can be packaged into JS. For this I looked for a long time, the feeling is packaging tools out of the question, but VUE-CLI packaging tools is very complex, specifically where, it is not easy to find.

Later by the big Guy reminded, check the network, found App.js request path has a problem. The request path is as follows

This is not right, App.js request path unexpectedly more a business. The packaged app.js is in the root directory, and if requested with a relative path, it must not be requested. The correct address for the app is that it should be. Http://localhost:8888/app.js

2. Find out why

Payroll problem, the next step is to start looking for reasons, due to the less familiar with Vue, this process really took a long time, the middle also consulted a lot of Vue's big guy, and then the big boys did not find the problem. The terrible thing is that none of them have ever encountered this problem.

After a day or two, I finally found the reason. Because I was misled by a Vue tutorial. This tutorial says to modify the Assetspublicpath of the build item in Webpack.base.config.js as a relative path

Pit Daddy Ah, I want to scold the landlord's heart all have. That tutorial is here. 1190000009291545

3. Workaround

Change the Assetspublicpath to absolute path '/' on it. It's so simple.

Multi-level routing request JS file path not correct method