由于相对路径错误,在 Apache Web 服务器上构建后部署 Vue 项目时出现问题

Problems deploying Vue project after build on Apache webserver due to wrong relative paths

我有一个简单的 Vue.js 项目。我 运行 命令 yarn build,然后将 dist/ 文件夹中的所有文件复制到 Apache 网络服务器上。

当我的URL指向生成的index.html时,什么也没有出现。我发现这是由于 index.html 指向包含 js 和 CSS 文件的错误相对路径。

例如,我注意到里面这个错误的亲戚index.html <script type=module src=/js/app.4dcb0a0b.js></script> 正确的应该是 <script type=module src=./js/app.4dcb0a0b.js></script> 应该是 ./js 而不是 /js.

我更正了相对路径后,index.html 显示正确。

如果我每次都必须手动更改错误的相对路径,这很繁琐。我怎样才能有更好的解决方案?

我正在使用@vue/cli 5.0.1,yarn v1.22.17

我会回答我自己的问题。

答案归功于本文

https://medium.com/js-dojo/how-to-solve-vue-js-prod-build-assets-relative-path-problem-71f91138dd79

解决方法是在 vue.config.js;

中添加以下行
module.exports = {publicPath: ''};

我不知道为什么这个解决方案有效。如果有人知道,请留下一些评论。谢谢。