Vue CLI无需服务器即可构建和运行index.html文件

Question

我使用的是最新vue-cli 版本3.0。

我当前的问题是，每当我运行npm run build该文件dist夹中生成的文件时，如果没有服务器就无法运行该文件。

我希望能够在浏览器上打开index.html文件。我该怎么做呢？

Answer 1

我遇到了类似的问题，以下两项更改帮助我使其正常运行。现在，我可以在Chrome中将index.html作为文件打开，以从文件系统运行SPA。

1. 在中vue.config.js，我没有publicPath配置，这导致使用default "/"。
   我必须将其配置为这样的空字符串，以便它使用相对路径：

   module.exports = {
       publicPath: '',
   }
   

   ^{PS：由于使用Vue CLI 3.3 publicPath而不是现在不推荐使用baseURL}

2. 我正在使用的history模式vue-router，该模式在本地文件系统上不起作用，无法将路径路由回index.html。因此，我省略了该模式以返回到默认hash模式。

Answer 2

通过手动更改url引用文件的大小，我能够解决此问题。

有点麻烦，但这是一个解决方案，而无需弄乱构建配置。

你需要做什么：

1. 打开 index.html
2. 查找href=/并替换为href=
3. 查找src=/并替换为src=

注意：因为我正在创建Phonegap应用程序，所以我需要此解决方案。