How Can I add data attribute to script tag using Nuxt Js?

Question

<script src="https://js.sample.js/fetchsample" data-cb-site="your-site"   
 data-cb-fbq-enabled="true"> 
</script>

I have this script. in nuxt js we have this kind of structure

 script: [
{src: "https://js.sample.js/fetchsample" , data-cb-site="your site",  data-cb-fbq-enabled="true" }
]

But I am getting an error on adding that data-cb-ste and data-cb-fbq-enabled data attribute . Error:

SyntaxError: Unexpected token -
  at new Script (vm.js:86:7)
  at Generator.next (<anonymous>)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:947:10)

Please help me.

Thanks in advance.

Answer 1

There is a hint in the SyntaxError you are getting:

SyntaxError: Unexpected token -

The dash - is not allowed in property names outside of quotes.

So you need to change data-cb-site to "data-cb-site" where you define it in the object literal.

And when you access fields with a dash - in the name, you must use square-bracket notation, eg object["data-cb-site"] not object.data-cb-site .

script: [
  {
    src: "https://js.sample.js/fetchsample", 
    "data-cb-site": "your site",
    "data-cb-fbq-enabled": "true"
  }
]