如何在 vue.js 中添加标签管理器到头部

Question

我的vue.js项目有问题。我有一个函数，我必须在我的项目中添加它。当我添加index.html我的函数（它是在头项目中创建 tagManager 的函数）时，属性不起作用。所以我尝试在mounted(). 但是我仍然有一个问题，如何将它添加到 tempate。我的功能是：

 <script>
  (function(w, d, s, l, i) {
    w[l] = w[l] || [];
    w[l].push({
      "gtm.start": new Date().getTime(),
      event: "gtm.js"
    });
    var f = d.getElementsByTagName(s)[0],
      j = d.createElement(s),
      dl = l != "dataLayer" ? "&l=" + l : "";
    j.async = true;
    j.src = "https://www.googletagmanager.com;
    f.parentNode.insertBefore(j, f);
  })(window, document, "script", "dataLayer");
  </script>

我想我会将这个脚本设置为mounted，然后做document.head.appendChild。但是函数太复杂了，所以有问题。知道如何将此脚本添加到我的项目头部吗？

Answer 1

将此脚本放在一个 js 文件中，不带<script>标签。例如，您可以将其命名为gtm.js

然后从main.js你的 vue.js 项目导入文件：

import './gtm.js'