3 min

Claude Code Skill for GTM JavaScript — No More ES5 Compilation Errors

claude-codegtmjavascriptanalytics

The Problem

I've been working with Google Tag Manager for years, and every time I asked an AI assistant to write GTM code, the same thing happened: it would use const, arrow functions, or template literals — and GTM would reject it with compilation errors.

Error: This language feature is only supported for ECMASCRIPT_2015 mode or better: const declaration.

GTM's Custom HTML tags only support ES5 JavaScript. This isn't documented prominently, and most developers discover it the hard way.

I had to manually convert everything back to ES5, every single time. So I built a Claude Code skill to solve this problem once and for all.

The Solution

GitHub - claude-skill-gtm-javascript

This skill teaches Claude Code the GTM constraints:

FeatureES6+ (Prohibited)ES5 (Required)
Variablesconst, letvar
Functions() => {}function() {}
Strings`${var}`'str' + var
Destructuring{a, b} = objvar a = obj.a
for-offor (x of arr)for (var i...)

What's Included

The skill includes four comprehensive files:

  • SKILL.md — Core rules and patterns for ES5 code generation
  • reference.md — Complete ES6 → ES5 conversion reference
  • examples.md — Production-ready code for dataLayer, ecommerce, consent
  • checklist.md — Testing and debugging guide for GTM

2024-2025 Updates

The skill also includes the latest GTM/GA4 updates:

  • IE11 Support Ended (July 15, 2024) — No longer need IE11 compatibility
  • Consent Mode v2 Required (March 2024) — New ad_user_data, ad_personalization parameters
  • Google Ads Auto-Tag (April 10, 2025) — Containers auto-load Google tag first
  • GA4 Ecommerce — Complete event schemas with items array
  • Server-side GTM — 1st-party domain patterns

Installation

git clone https://github.com/ekusiadadus/claude-skill-gtm-javascript.git ~/.claude/skills/gtm-javascript

Or for project-specific installation:

mkdir -p .claude/skills
cp -r skills/gtm-javascript .claude/skills/

Example: GA4 Purchase Event

Once installed, Claude Code will generate proper ES5 code:

ga4-purchase.js
(function() {
  'use strict';
 
  window.dataLayer = window.dataLayer || [];
  window.dataLayer.push({ ecommerce: null });
  window.dataLayer.push({
    event: 'purchase',
    ecommerce: {
      transaction_id: 'T_12345',
      value: 99.99,
      currency: 'USD',
      items: [{
        item_id: 'SKU_001',
        item_name: 'Product Name',
        price: 99.99,
        quantity: 1
      }]
    }
  });
})();

Example: Consent Mode v2

consent-mode-v2.js
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
 
gtag('consent', 'default', {
  ad_storage: 'denied',
  ad_user_data: 'denied',
  ad_personalization: 'denied',
  analytics_storage: 'denied'
});

Why This Matters

GTM runs code through Google Closure Compiler, which only supports ES5 for Custom HTML tags. This limitation isn't going away — it's been this way for years.

Every developer working with GTM faces this problem. Every AI assistant generates ES6+ code by default. This skill bridges that gap.

Feedback Welcome

I'd love to hear from anyone working with GTM or building Claude Code skills:

  • Are there GTM patterns I missed?
  • What other analytics tools have similar constraints?
  • How can the skill be improved?

GitHub Repository