Vue3打包部署报错解决

通常情况下，我们直接npm run build后的代码可以直接部署在服务器上，以便老板远程访问。但是今天写了个简单的demo发现部署后不能直接访问。作为一个菜鸟，被领导催的也是心急如焚。

但奇怪的是，vscode的open live server却没有任何问题。

冥思苦想苦思冥想无法解决，问了同事大佬，原来是要在打包前的vue config下加一下publicPath：‘./’：

于是重新打包，再部署到服务器，解决啦！！！

知其然还要知其所以然，我们看一下官网的解释：

部署应用包时的基本 URL。用法和 webpack 本身的 output.publicPath 一致，但是 Vue CLI 在一些其他地方也需要用到这个值，所以请始终使用 publicPath 而不要直接修改 webpack 的 output.publicPath。

默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上，例如 https://www.my-app.com/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.my-app.com/my-app/，则设置 publicPath 为 /my-app/。

这个值也可以被设置为空字符串 ('') 或是相对路径 ('./')，这样所有的资源都会被链接为相对路径，这样打出来的包可以被部署在任意路径，