Question

环境变量在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>

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

Answer 1

在prod.env.js和module.exports = merge(prodEnv, { NODE_ENV: '"development"', MY_VAR: '"something"' })中，你写的内容如下：

process.env.MY_VAR

然后，您可以在Quasar应用代码中使用JSON.stringify()。

注意报价+双引号。 Quasar中的构建过程使用Webpack的DefinePlugin（docs），它需要JSON编码值。使用<rule name="abort https" stopProcessing="true"> <match url="(.*)" /> <conditions> <add input="{HTTPS}" pattern="off" /> </conditions> <action type="CustomResponse" statusCode="404" statusReason="1" statusDescription="1" /> </rule>获取更复杂的值，例如JS Objects。

如何从Quasar Framework获取环境变量

1 个答案: