GTM with partytown does not work

I’m trying to use Google Tag Manager with Partytown and Nuxt 3.

• It works when I disable Partytown, so GTM + GA is configured correctly. I see all event and stuff pop up
• Nothing happens when I enable Partytown. No Events in GTM, nothing in GA, dataLayer empty

nuxt.config.js

import { defineNuxtConfig } from 'nuxt';

export default defineNuxtConfig({
    modules: [
        '@nuxtjs/partytown',
    ],

    partytown: { forward: ['dataLayer.push'] },

    app: {
        head: {
            script: [
                {
                    children: `
                        (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/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
                        })(window,document,'script','dataLayer','GTM-XXXXXX');
                    `,
                    type: 'text/partytown',
                },
            ],
        },
    },
});

I then use window.dataLayer.push({ event: 'pageView' }) --> nothing happens I see that partytown correctly adds the scripts with text/partytown-x to head

I’ve tried another head implementation:

script: [
    {
        children: `
            window.dataLayer = window.dataLayer || [];
        `,
    },
    {
        src: 'https://www.googletagmanager.com/gtm.js?id=GTM-P6KLMD5',
        async: true,
        type: 'text/partytown',

    },
],

Both versions work, as long as I disable text/partytown. As soon as I enable partytown, It seems nothing is happening at all. I know that the GTM Debugger seems not to work with Partytown, but I don’t see anything happen, also not in GA.

I’ve set things up according to this docs and your readme (which is incomplete on gtm)

I can’t figure out what is wrong as partytown should be more or less a “drop-in”, not requiring further config.

[jelmerdemaat]

I tried to install and enable this module, but can confirm that nothing happens. There is no output in the console about Partytown, no new Partytown scripts, no working GTM.

Setup is Nuxt v2.15.8, using:

npm i -D @nuxtjs/partytown

{
  modules: ['@nuxtjs/partytown'],
  partytown: {
    forward: ['dataLayer.push'],
  },
  app: {
    head: {
      script: [
        { src: 'gtm/url/here', async: true, type: 'text/partytown' },
      ],
    },
  },
}

It seems the module does nothing. Adding debug: true to the config also does nothing.

[iamdagy]

Today I gave it another go without success,

I think im getting closer to get it to work, your help would be greatly appreciated @danielroe.

this is the code im using in nuxt.config:

 app: {
        head: {
            viewport: 'width=device-width, initial-scale=1, maximum-scale=1',
            charset: 'utf-8',
            script: [
                {
                    src: 'https://www.googletagmanager.com/gtm.js?id=GTM-MYGTM',
                    async:true,
                    type: 'text/partytown'
                },
                {
                    hid: 'gtm',
                    innerHTML: 'window.dataLayer = window.dataLayer || [];(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/gtm.js?id=\'+i+dl;f.parentNode.insertBefore(j,f);})(window,document,\'script\',\'dataLayer\',\'GTM-MYGTM\');'
                }
            ]
        },

    }