在vuejs应用程序中使用环境变量

时间:2018-08-13 13:48:27

标签: javascript node.js vue.js environment-variables

我阅读了此articles,了解如何在vuejs中使用环境变量。

我已经设置了本地.env.local文件并安装了dotenv

VUE_APP_AUTH_AUTHORITY = 'http://localhost/auth'

我有一个配置文件

export default {
  AUTH_AUTHORITY: process.env.VUE_APP_AUTH_AUTHORITY,
}

这在我的本地计算机上有效。

在开发中准备好构建后,我想将构建输出部署到生产环境并在生产中设置环境变量。

必须在开发环境中完成构建,并将输出发送到其他位置的生产团队。

看起来该应用程序没有在生产环境中使用env变量。

我已经在服务器(Windows 2012)上设置了VUE_APP_AUTH_AUTHORITY的值,并且该应用程序正在IIS上运行。

是否需要在软件包的构建过程中设置该值才能使其在应用程序中可用?

1 个答案:

答案 0 :(得分:1)

.env.*中指定变量时,您将无法在运行时进行更改,因为在与Webpack捆绑期间,这些“变量名”只会被变量值替换(为此使用DefinePlugin)。 / p>

您可以在输出js捆绑包中看到您的process.env.VUE_APP_AUTH_AUTHORITY 只是在代码中被'http://localhost/auth'字符串替换了。因此,env变量仅在构建期间使用(由Nodejs环境实现)。

对于生产环境,您应该使用变量准备.env.production并以production模式构建应用。

另请参阅文档:Using Env Variables in Client-side Code / Vue Cli