How to remove # in the path by Vue

This article introduces the knowledge of "how to remove # in the path of Vue". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

In the process of development, it is found that the path is marked with / # /, and it can not be removed, it is very ugly.

As we all know, there are two modes of vue-router, hash mode and history mode.

The one with # is hash mode.

Just set the mode in router to history

Next, there is a problem, as soon as the interface is refreshed, it will become 404!

After searching on the Internet, we need to configure the back-end environment.

Here is only the configuration of nginx. Click here for other configurations to see the official website.

Configure config/index.js first

Change assetsPublicPath to root directory

Module.exports = {build: {env: require ('. / prod.env'), index: path.resolve (_ _ dirname,'.. / dist/index.html'), assetsRoot: path.resolve (_ _ dirname,'.. / dist'), assetsSubDirectory: 'static', assetsPublicPath:' /', / / hash mode will be added here as assetsPublicPath:'. / 'productionSourceMap: true by default ...}}

Then configure nignx

Server {listen 0.0.0.0 root 12345; location / {root / home/ my application and directory; try_files $uri $uri/ / index.html = 404; / / this is the key} error_page 404 / index.html} "how Vue removes the # in the path". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!