wake-up-neo.com

Fehler beim Intercom-ECMASCRIPT6-Tag-Manager

Ich habe zuvor erfolgreich Intercom mit Google Tag Manager eingerichtet. Ich habe es seit ein paar Monaten nicht angerührt und mache ein neues Tag, aber ich bekomme diesen Fehler vom Intercom-Tag:

Error at line 6, character 243: this language feature is only supported for ECMASCRIPT6 mode or better: block-scoped function declaration. Use --language_in=ECMASCRIPT6 or ECMASCRIPT6_STRICT or higher to enable ES6 features.

Mein Skript für Intercom hat sich seit der ersten Bearbeitung nicht geändert:

<script>
  window.intercomSettings = {
    app_id: "key"
  };
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.Push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/key';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()</script>

Wenn jemand auf diesen Fehler gestoßen ist und Ratschläge oder Tipps zur Lösung hat, wäre er sehr dankbar.

4
chdonncha

Bevor GTM den Code in eine minimierte JavaScript-Datei umschließt, um ihn in eine Seite einzufügen, durchläuft der Code einen Linter. Das Problem hierbei ist, dass Google manchmal die Regeln für den Linter ändert, um sie strenger zu gestalten (dies ist im GTM-Forum ein paar Mal aufgetreten). Da dies nirgendwo angekündigt wird, bricht es gelegentlich Tags, die zuvor funktionieren.

Das Problem hier scheint zu sein, dass Sie eine Funktion innerhalb eines if/else-Blocks deklarieren. Sie können dies sehen, wenn Sie Ihre Datei "verschönern":

<script>
    window.intercomSettings = {
        app_id: "key"
    };
</script>
<script>
    (function() {
        var w = window;
        var ic = w.Intercom;
        if (typeof ic === "function") {
            ic('reattach_activator');
            ic('update', intercomSettings);
        } else {
            var d = document;
            var i = function() {
                i.c(arguments)
            };
            i.q = [];
            i.c = function(args) {
                i.q.Push(args)
            };
            w.Intercom = i;

            function l() {
                var s = d.createElement('script');
                s.type = 'text/javascript';
                s.async = true;
                s.src = 'https://widget.intercom.io/widget/key';
                var x = d.getElementsByTagName('script')[0];
                x.parentNode.insertBefore(s, x);
            }
            if (w.attachEvent) {
                w.attachEvent('onload', l);
            } else {
                w.addEventListener('load', l, false);
            }
        }
    })()
</script>

Die "l" -Funktion wird innerhalb des "else" -Blocks deklariert und Googles Linter gefällt das nicht (da ältere Versionen von Javascript technisch keinen Sperrbereich für Funktionen haben, wurde dies nur mit ES6 eingeführt). 

Ich bin sicher, dass es einen korrekten Weg gibt, um dies zu beheben, ein einfacher Ausweg wäre, die Deklaration von "l" außerhalb des Blocks zu verschieben:

<script>
    (function() {
        var w = window;

        function l() {
            var s = d.createElement('script');
            s.type = 'text/javascript';
            s.async = true;
            s.src = 'https://widget.intercom.io/widget/key';
            var x = d.getElementsByTagName('script')[0];
            x.parentNode.insertBefore(s, x);
        }
        var ic = w.Intercom;
        if (typeof ic === "function") {
            ic('reattach_activator');
            ic('update', intercomSettings);
        } else {
            var d = document;
            var i = function() {
                i.c(arguments)
            };
            i.q = [];
            i.c = function(args) {
                i.q.Push(args)
            };
            w.Intercom = i;


            if (w.attachEvent) {
                w.attachEvent('onload', l);
            } else {
                w.addEventListener('load', l, false);
            }
        }
    })()
</script>

Sieht nicht so aus, als hätte es Nebeneffekte und das Tag funktioniert jetzt (zumindest wenn ich es versuche).

12
Eike Pierstorff

Hier ist eine vollständige Antwort auf den Vorschlag von @ ruben-stolk. Sie müssen auch ein Semikolon am Ende der neuen Funktion einfügen, wie im folgenden Snippet. Dies wurde in GTM getestet und die Flusenfehler bestanden.

<script>
  window.intercomSettings = {
    app_id: "xe395ivj"
  };
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.Push(args)};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/xe395ivj';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()</script>

4

Sie können versuchen, Ihren Code zu ändern

function namedFunction(x) {}

zu

var namedFunction = function(x){}
1