javascript - GTM JavaScript 编译器错误 ECMASCRIPT6

Question

我的问题是关于我使用 JavaScript 将一些表单数据从 Webflow 发送到 Typeform。当我在 Google Tagmanager 中创建自定义 html 标签时，出现此错误:

JavaScript Compiler Error Typeform Tag
Error at line 3, character 1: This language feature is only supported for ECMASCRIPT6 mode or better: const declaration.

第4、5、6、13、14、15行出现同样的错误。

这是我的代码:

<script>
  $( "#formbutton" ).click(function() {
    const naam = $('#Naam-2').val();
    const email = $('#Email-2').val();
    const postcode = $('#Postcode-2').val();
    Cookies.set('naam', naam, { expires: 30 } );
    Cookies.set('email', email, { expires: 30 } );
    Cookies.set('postcode', postcode, { expires: 30 } );
  });

  var Webflow = Webflow || [];
  Webflow.push(function() {
    const naam = Cookies.get("naam");
    const email = Cookies.get("email");
    const postcode = Cookies.get("postcode");
    $('#naam').val(naam);
    $('#email').val(email);
    $('#postcode').val(postcode);
  });
</script>

请分享您的想法或任何建议，我们将不胜感激! - 提前谢谢你。

Answer 1

const 和 let 是声明仅在 ES6(JavaScript 的一个版本)或更高版本中可用的变量的不同方法。 Google 跟踪代码管理器不支持 ES6，因为我今天在使用箭头函数的另一个 ES6 功能时发现了这一点。

在您的情况下，将 const 关键字或 let 的任何实例更改为关键字 var 可能会解决您的问题。

我看到您的实际问题是 cookie 同意，但如果有人在 GTM 中遇到 ES6 或 Ecmascript 6 错误。在线搜索 ES6 功能以寻找使用 ES5 的替代品。其他首字母缩略词是 ES2016 与 ES2015。不要问我关于命名约定的问题，因为它非常令人困惑。

另一个技巧是将您的代码粘贴到 BabelJS 的在线版本中，然后在您使用 ES2015 复选框时查看它会吐出什么。 BabelJS 是一个转译器/编译器，它采用 future 语法 JS 并将其转换为旧版本语法。比如看吐出来的前后代码:

原始 ES6 代码(使用箭头函数、const 和 let):

window.addEventListener("load", (event) => {
  const myVariable = "text";
  let anotherVariable = 8;
});

从 BabelJS 输出到 ES2015/ES5:

window.addEventListener("load", function (event) {
  var myVariable = "text";
  var anotherVariable = 8;
});