How to get process.env.GTM in index.template.html?

[Diferno]

Hi!
I’m using vue-gtm plugin, and want to use different tags for dev and production.
Currently I’m putting them in the quasar.conf file as shown in the documentation. But can’t figure out how to capture them in the html:

build: {
  env: ctx.dev
    ? { // so on dev we'll have
      GTM: '"GTM-XXDEV"'
    }
    : { // and on build (production):
      GTM: '"GTM-XXPROD"'
    }
}

And in the html I’m tying with:

<script>(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','<%= htmlWebpackPlugin.GTM %>');</script>

Already tryed with:
<%= htmlWebpackPlugin.env.GTM %>
<%= htmlWebpackPlugin.process.env.GTM %>
<%= process.env.GTM %>

But with the same awful result
Thx in advance!

[rstoenescu]

Hi,

Just added a commit for this functionality. Will be available in v0.17 (no worries, just a simple breaking change on a prop on QLayoutDrawer).
It will work as <%= htmlWebpackPlugin.process.env.GTM %>

[Diferno]

Thx a lot!

[matroskin]

Now it works?

[vesteves]

@matroskin yep.
But now, you need to put OPTIONS before the PROCESS like this.

<%= htmlWebpackPlugin.options.process.env.GOOGLE_RECAPTCHA_SITE %>

[yhu420]

As an update for those wondering, I got it working simply using <%= process.env.GOOGLE_CLIENT_ID %>