Question

我在调用Vue之前在main.js文件中设置配置：

Vue.prototype.$api_url = process.env.NODE_ENV === 'production' ? 'https://api.xxx.com' : 'https://yyy.test:8443'

如果我在任何Vue文件中访问this.$api_url，它都可以工作。

但是在store.js（Vuex）中，这是另一个呈现的Vue实例，因此我无法访问this.$api_url。

如何在文件和Vue.use(configs.js)中设置配置？

为了在main.js/store.js中获取其变量，我应该在configs文件中做什么？

谢谢。

Answer 1

制作一个独立的config.js文件，然后从该文件导出配置对象。并在需要的地方导入配置。如果希望在所有Vue组件中提供相同的配置，也可以将相同的配置分配给Vue的原型。

更新：

因此，这是您可以执行的操作：

在您的config.js中

let config;

if (process.env.NODE_ENV === "production") {
  config = {
    $api_url: "https://api.xxx.com",
    timeoutDuration: 30000,
    someOtherProps: 'xyz'
  };
} else {
  config = {
    $api_url: "https://yyy.test:8443",
    timeoutDuration: 1000,
    someOtherProps: 'abc'
  };
}

export { config }

在您的main.js中

import { config } from 'config';

Vue.prototype.appConfig = config

要在.vue文件中使用任何方式使用this.appConfig.$api_url

在store.js中

import { config } from 'config';

使用config.$api_url任意使用方式

如何将配置文件导入Vue.JS + Vuex

1 个答案: