Vue.js构建无法与npm运行构建一起使用

Question

我正在尝试获取vue.js源代码以进行生产。我用了这个命令npm run build。我有一个dist文件夹，index.html文件夹名为staticall css和js。

当我试图运行index.html在本地主机，即，XAMPP服务器我得到了一个空白页。

是否有可能与vue.js在运行XAMPP。

Answer 1

首先在项目根目录中创建vue.config.js文件，并使用以下代码在其中定义基本URL

module.exports = {
  baseUrl: process.env.NODE_ENV === 'production'
    ? '/production-sub-path/'
    : '/'
}

用您的文件夹名称替换production-sub-path。http://www.example.com/production-sub-path/ ...并运行以下命令来构建项目

npm run build

完成构建后...将dist文件夹中的所有文件复制/上传到您的/ production-sub-path /文件夹中...就这样

对于那些出现以下错误的人：“vue.config.js 中的无效选项：不允许“baseUrl””我可以通过将“baseUrl”更改为“publicPath”来修复它 (4认同)

Answer 2

Vue.js 是一个浏览器端应用程序框架。服务器端技术并不重要，除非您尝试进行服务器端渲染。

npm run build工作得很好，它为 , 和创建了一组缩小manifest.#.js的vendor.#.js文件app.#.js

打开 Google Chrome 开发者工具中的网络选项卡，查看正在加载哪些文件。如果任何 js 文件未加载，则您需要进行路径配置，以便您的服务器提供正确的文件。

您可能需要index.html稍微调整文件以使其完全满足您的要求，并将js文件从dist/static文件夹移动到您的首选位置。只要应用程序文件以正确的顺序提供，URL 路径并不重要。