Vuejs2 每个应用程序安装的Vue本地配置文件

我是Vue.js的新手，我正在尝试应用程序的第一步。因此，为了理解基础知识，我希望每个应用程序安装一个本地配置文件，以自定义代码中所需的一些变量

因此，在main.js中，我尝试了以下方法：

import Vue from 'vue'
import App from './App.vue'

let config;

try {
  config = require('../config.json');
} catch (e) {
  config = require('../public/config.json');
}

Vue.config.productionTip = false;
Vue.prototype.$localConfig = config;

new Vue({
  render: h => h(App)
}).$mount('#app');

在我使用dist文件夹构建生产版本之前，这是有效的。如果我在dist的根目录中打开config.json并更改属性值，我将始终看到开发环境中第一个定义的值。那么webpack是否在缓存？对于每个应用程序安装，这是否是处理此类本地配置文件的正确方法

---

也许有人可以给我一些建议。

执行

config=require（'../config.json'）

与从“./config.json”导入配置的方式相同，它在构建时获取

json

文件的内容，将其转换为JS对象，并使其成为应用程序包的一部分

你可以按照你在评论中的建议去做（在你的

index.html

中的

脚本

标记中包含文件），但这意味着你的应用程序正在向服务器发出额外的请求来加载配置，这样做会增加“渲染时间”（用户必须等待页面完全渲染的时间）

---

在Vue/Webpack世界中处理应用程序配置最常用的方法是使用-这些也“起作用”在构建时，您需要为每个环境分别构建应用程序

目前最简单、最快的方法是在应用程序的index.html模板文件中包含config.js，并以这种方式加载它-Vue.prototype.$config=window.APPCONFIG；-也许不是最好的选择，但正如预期的那样。也许有人有更好的方法来处理这件事。。。

let config
const configPromise =
  process.env.NODE_ENV === 'development'
    ? import('../config.json')
    : import('../public/config.json')
configPromise.then(res => {
  config = res.default
})