Javascript 如何访问组件中的vuejs webpack配置变量？

我正在使用该模式在我的/config/[xxx].env.js文件中存储配置变量，如下所示：

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  API: {
    ROOT: "'http://blah.blah.blah'"
  },
  CONNECTORS: {
    SPOTIFY: {
      CLIENT_ID: "'blah'",
      SCOPES: "'blah'",
      REDIRECT_URI: "'blah'"
    }
  }
})

注意，其中一些并不是特定的环境变量，但我想将这些类型的配置变量放在一个集中的位置

在my main.js中，我可以通过

process.env

访问变量：

Vue.http.options.root = process.env.API.ROOT

但在较低级别的组件中，“过程”并不存在

我知道它不应该，因为它不是全局定义的，但我不知道如何从组件中访问process.env对象。我知道我可以让它全球化，但那“感觉不对”

两个问题：

是否有其他Vue导入/对象无法访问process.env

是否有更好的方法来存储这些可能依赖于环境的集中式值？我见过ruby config gem这样的东西，它很好地将特定于环境的配置分层到默认配置之上

我确实尝试了npm配置gem，但由于某种原因它丢失了 其他必需的NPM，并且似乎面向node.js，并且 感觉我没有使用什么vue cli网页包是做错了什么

---

提供。

通常，让组件能够查看来自其他组件的数据或表单的公认“行业标准”方法是使用VueX。这与Redux中的React类似。一开始看起来有点复杂，但实际上很简单，VueX让您不必担心任何给定组件如何查看任何给定数据，同时还解决了许多其他问题。试试看

---

当然，另一种方法是在你的应用程序中有一个模块，它实现了一种“单例模式”，这样任何代码都可以直接导入和导出数据。

是的，我已经在使用Vuex了。这是有道理的，我将在应用程序加载时将其转储到存储中。Vuex用于在为客户端加载应用程序后将发生更改的状态。如果这些构建配置变量在vue应用程序的生命周期中不会改变，那么最好将它们放在服务容器中，例如。