如何从 Quasar Framework 获取环境变量答案

【问题标题】：How to get environment variable from Quasar Framework如何从 Quasar Framework 获取环境变量
【发布时间】：2017-05-02 13:25:44
【问题描述】：

环境变量定义在config/目录prod.env.js和dev.env.js，如何在.vue文件中获取这些变量？

我尝试过使用process.env.MY_VAR，假设它是 nodejs 内置库，它会报错：

[=======             ] 34% (building modules){ SyntaxError: Unexpected token (1:5)

.vue 文件中的最小代码：

<template>
  <q-layout>
    <div class="layout-view">
          <button class="primary" @click="foo">
            <i class="on-left">lock</i> Login
          </button>
    </div>
  </q-layout>
</template>
<script>
  export default {
    data() {
      return { url: '' }
    }
    methods: {
      foo: function() {
        this.url = process.env.MY_VAR // no error if commented
      }
    }
  }
</script>

获取这些环境变量的正确方法是什么？

【问题讨论】：

标签： vuejs2 quasar

【解决方案1】：

在dev.env.js 和prod.env.js 中，您可以编写如下内容：

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  MY_VAR: '"something"'
})

然后你可以在你的 Quasar 应用代码中使用process.env.MY_VAR。

注意引号 + 双引号。 Quasar 中的构建过程使用 Webpack 的 DefinePlugin (https://webpack.js.org/plugins/define-plugin/)，它需要 JSON 编码的值。使用 JSON.stringify() 处理更复杂的值，例如 JS 对象。

【讨论】：

Quasar 太棒了！
这是什么版本的？