Javascript 在index.html中使用环境变量

我正在使用angular，我想在我的index.html中为谷歌分析使用一个环境变量。我试着这样做：

<script>
    import {environment} from "./environments/environment";
</script>
<!-- End Google Tag Manager (noscript) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=" + environment.googleAnalytics></script>
<script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());


    gtag('config', environment.googleAnalytics);
</script>

从“/environments/environment”导入{environment}；
window.dataLayer=window.dataLayer | |[]；
函数gtag（）{dataLayer.push（参数）；}
gtag（'js'，新日期（））；
gtag（'config'，environment.googleAnalytics）；

---

但在脚本链接中不起作用。你能帮我吗？在这个地方

https://www.googletagmanager.com/gtag/js?id=“+environment.googleAnalytics

不起作用此连接

需要在依赖项中添加google anlytics，然后将跟踪代码添加到index.html，如下链接所述

npm install --save @types/google.analytics

此链接可能有助于找到解决方案。请浏览此线程

---

您不能编写这样的连接，因为

是一个html标记，而不是JavaScript代码。也许您希望通过JavaScript加载该脚本，这样您就可以连接您的

环境.googleAnalytics

属性。

一个好方法是使用不同的

index.html

文件（

index.dev.html

，

index.prod.html

等），在其中明确定义所需的环境变量。然后，使用文件替换功能，在它们之间切换（与替换环境文件的方式相同）

---

您应该创建index.html的副本，并将其命名为index.someenv.html。然后在angular.json in environment配置设置文件中替换：

"fileReplacements": [{
    "replace": "src/index.html",
    "with": "src/index.someenv.html"
}]

运行生成时，angular cli将替换这些文件

"fileReplacements": [{
    "replace": "src/index.html",
    "with": "src/index.someenv.html"
}]