zadigetvoltaire / nuxt-gtm

Nuxt 3 module for Google Tag Manager
https://www.npmjs.com/package/@zadigetvoltaire/nuxt-gtm
MIT License
70 stars 4 forks source link

How to configure the module using enviroment variables #11

Open madskronborg opened 1 year ago

madskronborg commented 1 year ago

Hey there!

Thank you for your work on this module! :clap:

I have been trying to configure the module with environment variables by setting the id using NUXT_PUBLIC_GTM_ID, but it does not work - do you have an example of how to configure the module through environment variables?

If it is not possible to do at this moment, would it be something you are interested in supporting in a future release?

juyaki commented 1 year ago

@madskronborg A bit late, but if it can help I was able to do it that way:

in nuxt.config.ts

  gtm: {
    id: process.env.NUXT_PUBLIC_GOOGLE_TAG_MANAGER_ID as string
  },

This is because in nuxt.config.ts vite didn't put the env variable in runtimeconfig yet, so you have to do it the old way with process.env.XXX

When you launch your project, don't forget to specify the path of your env file. Eg with two different env files:


  "scripts": {
    "generate-dev": "nuxt generate --dotenv .env.dev",
    "generate-prod": "nuxt generate --dotenv .env.prod",
    "dev": "nuxt dev --dotenv .env.dev",
    "prod": "nuxt dev --dotenv .env.prod",
  },