Vue CLI构建并运行没有服务器的index.html文件

Question

我正在使用最新的vue-cli version 3.0。

我当前的问题是，每当我运行npm run build时，dist文件夹中生成的文件都无法在没有服务器的情况下运行。

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

Answer 1

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

1. 在 var product = { importcsvProduct: function (req,res) { console.log(req.body.file); } }; module.exports = product; 中，我没有配置vue.config.js，这导致默认的“ /”。我必须将其配置为像这样的空字符串，以便它使用相对路径：

   baseUrl

2. 我正在使用module.exports = { ... baseUrl: '', ... } 的{​​{1}}模式，该模式不起作用 在本地文件系统上将路径路由回到index.html。所以我 省略了该模式以返回默认的history模式。

Answer 2

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

这有点痛苦，但这是一个解决方案，而不必乱用构建配置。

您需要做什么：

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

注意：我需要此解决方案，因为我正在创建一个Phonegap应用。

Answer 3

您可以使用http-server模块

npm install http-server -g
http-server dist/

通常服务器从端口8080开始，因此您可以在http://localhost:8080

上提供构建应用程序