无法读取VueJS上下文中的环境变量



我试图在我的组件中使用环境变量。但是当我使用变量时,它开始工作,但随后它抛出一个错误。

Component.vue

website: 'testing-hard-reality'

代码在硬编码时工作得非常好,如上所示。如果使用环境变量而不是硬码,则会得到一个错误

.env.local

VUE_APP_WEB_SITE: 'testing-hard-reality'

在组件中,变量被用作:

website: process.env.VUE_APP_WEB_SITE

在我的控制台中,我得到的错误是

[Vue warn]: v-on处理程序错误:"错误:网站名称未设置">

请告诉我该怎么做。

在src文件夹的同一层创建一个文件

.env.development.local用于本地工作

.env.production.local用于生产

在文件中添加env变量

VUE_APP_MY_VARIABLE_NAME = my-value-here

VUE_APP_*部分很重要,因为vue项目中的所有env变量都需要以这个前缀开头。

现在要访问这个值,执行:

process.env.VUE_APP_MY_VARIABLE_NAME

重要一步

当您修改.env文件时,您必须停止服务器并重新启动它以获得环境更改。

我猜您正在使用vue-cli来构建您的vue项目。在vue-cli文档中,我找到了env的语法。本地将是

VUE_APP_WEB_SITE=testing-hard-reality

不是你的演示:VUE_APP_WEB_SITE: 'testing-hard-reality'

裁判:https://cli.vuejs.org/guide/mode-and-env.html环境变量

相关内容

  • 没有找到相关文章

最新更新