本文主要介绍在实际开发中，Vue项目编译部署在非网站根目录下，通过搜索学习得到的解决方法。本域名环境：www.admin.com/version1/修改配置文件，修改打包后的资源引用路径在config/index.js中的build属性下找到assetsPublicPath，将/改为/version1/build:{//PathsassetsRoot:path.resolve(__dirname,'../dist'),assetsSubDirectory:'static',assetsPublicPath:'/version1/',...}修改打包样式（图片、视频、字体文件等）的引用路径为findbuild在/utils.js中添加或修改publicPath:'../../'//在指定该选项时提取CSS//（在生产构建期间就是这种情况）if(options.extract){returnExtractTextPlugin.extract({use:loaders,fallback:'vue-style-loader',publicPath:'../../'})}else{return['vue-style-loader'].concat(loaders)}修改项目的路由在路由的历史模式中，所有的路由都是基于根路径，比如/xxxx。由于项目部署在/version下，我们可以通过修改路由来保证页面的正常访问。我们可以定义一个变量来区分开发环境和生产环境。找到config/dev.env.js，定义一个ROUTER_BASE变量，值为/，{代表开发环境是基于根目录}module.exports=merge(prodEnv,{NODE_ENV:'"development"',ROUTER_BASE:'"/"'})找到config/prod.env.js，定义一个ROUTER_BASE变量，值为/version1/，{表示生产环境是基于version1目录}module.exports=merge(prodEnv,{NODE_ENV:'"开发人员t"',ROUTER_BASE:'"/version1/"'})vue-router提供了一个base属性，表示应用的基目录constrouters=newRouter({mode:'history',base:process.env.ROUTER_BASE,...})至此，base可以根据我们定义的变量ROUTER_BASE来区分环境，至此打包配置的相关修改已经完成，可以正常访问项目，但是还是有一个问题，跳转到某个路由后，刷新页面，是gg，页面是空白的，此时需要修改nginx配置，vue给出的nginx配置是基于根目录的。对于官方链接，需要根据实际部署的网站目录调整location/{try_files$uri$uri//index.html;//官方指导//需要修改为try_files$uri$uri//version1/index.html;}完美的
