Vue项目使用history模式，打包部署到二级目录

需求：Vue项目使用history模式，打包部署到服务器上的二级目录。
示例：your host name/h5/index.html  

原理：把页面地址所有含有/h5/的url重定向到：根目录 -> h5/ -> /h5/index.html

1、打包注意：找到vue.config.js文件，修改publicPath，对应服务器上的二级目录名

 

2、路由配置：找到router.js文件，设置 mode: 'history', 基础url配置 base：'/h5/'

          

 

  3、Nginx配置：

location /h5/ {
   try_files $uri $uri/ /h5/index.html;
}

这样配置之后，所有打包之后的js,css,等文件url请求上面都会携带h5。

注意： 此处二级目录是h5，所以publicPath,history模式以及nginx中都设置为h5。根据需要改成你自己的二级目录名。