vue html内插ReferenceError

Question

所以我把这个放在我的public/index.html里

<script type="text/javascript">
   rg4js("apiKey", "<%= VUE_APP_RAYGUN_API_KEY %>");
   rg4js("enableCrashReporting", true);
</script>

在我的.env中已经有了一个变量：

VUE_APP_RAYGUN_API_KEY=qzltkC0KuN1234

在本地中运行得很好，但是当我想通过bitbucket管道将它部署到aws时，它说

ReferenceError: VUE_APP_RAYGUN_API_KEY is not defined

在npm run test:unit下

你知道这是怎么回事吗？

Answer 1

您的.env文件仅在本地。它不应该提交到您的git存储库，而且没有任何东西会使用它。

为了在bitbucket管道中使用环境变量，您必须在bitbucket上直接声明它们:在pipeline.yml编辑器中，有一个显式名为"Add变量“的选项。在这里声明你的变量。

还可以在Repository > Settings > Repository变量中全局声明

然后可以使用$MY_VAR在管道中使用它们。这些变量只能在bitbucket管道步骤中使用.

​

​

若要从vue应用程序中访问变量，必须在构建步骤中按以下方式公开这些变量：

- step:
   name: Deploy
   deployment: production
   script:
      - yarn build
        variables:
           MY_VAR: $MY_VAR
           MY_API_KEY: $MY_API_KEY