vue 项目部署到非目录的方式vue 项目部署到非根目录........... vue 项目部署到非根目录.....

1. 修改 vue router 的配置

默认是 hash 模式,

new Router({
  base: '/v2/test-url',  // 默认是 '/',修改为自己想要的地址就可以
  routes: constantRoutes
})

2. 修改 webpack 配置

关于webpack 的配置可以看官网英文文档中文文档

module.exports = {
   ...
    output: {
    path: path.resolve(__dirname, '../dist'),
    filename: '[name].js',
    publicPath: "/v2/test-url"   
  },
   ...
}

3.部署项目,修改 nginx 配置

nginx 配置如下
注意 alias 和 root 两种配置方式的区别. 随便搜的一篇文章

   location /v2/test-url {
            alias html/;
            index  index.html index.htm;
        }

然后重启 nginx,就可以在非根目录访问项目了

自己测试过没有问题,还请各位指正