在搞资源文件全球加速时需要将 JS,CSS,IMG 等静态资源放到 CDN 服务器上，WEB 网站上引用CDN 上缓存的资源，因为网站用vue-cli 搭建的，所以需要对 vue-cli 配置文件 (vue-config-js) 进行修改，修改打包后的index.html中静态资源引用路径。
vue.config.js
module.exports = {
publicPath: process.env.NODE_ENV === "production" ? "https://resource.xxx.com/" : "/",
}
publicPath
部署应用包时的基本 URL，默认值'/'。默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上。如 https://my-app.com/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://my-app.com/my-app/，则设置 publicPath 为 /my-app/。
用法和 webpack 本身的 output.publicPath 一致，但是 Vue CLI 在一些其他地方也需要用到这个值，所以请使用 publicPath 而不要直接修改 webpack 的 output.publicPath。
这个值也可以被设置为空字符串 '' 或是相对路径 './'，这样所有的资源都会被链接为相对路径。
该值也是打包后生成的 index.html 静态资源文件引用的路径。通常打包后静态资源找不到时修改 publicPath 即可。
如上代码打包后生成的 index.html 中 js 的 src 为：https://resource.xxx.com/app.js
这时静态资源 CDN 已经结束，但是使用vue-cli 3.x的用户打包完运行发现自己的路由炸了，所有的路由都变成http:domain.com/https://resource.xxx.com/#/xx，都多加了https://resource.xxx.com/，不要慌，既然是路由的问题，咱就看一下 路由配置文件
router.js
const router = new VueRouter({
base: process.env.BASE_URL,
routes
})
base
应用的基路径，默认值 '/'。
例如，如果整个单页应用服务在 /app/ 下，base 就应该设为 "/app/"
vue-cli 3.x 默认配置base 为 process.env.BASE_URL，即为 baseUrl
baseUrl 从 Vue CLI 3.3 起已弃用，替换为 publicPath
BASE_URL 和 vue.config.js 中的 publicPath 选项相符，即你的应用会部署到的基础路径
因为我们刚刚在 vue.config.js 中设置了 publicPath 为 https://resource.xxx.com/，所以路由变成了这副鬼样子。
既然找到原因，那就根据自己想要的路径修改路由的 base 即可。
如果不需要特别处理路径，去掉 base 或将 base 改为'/' 就可以搞定了！！！
————————————————
版权声明：本文为CSDN博主「躺在家里不干活」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_29491885/article/details/1192538988
