Nuxt.js: The configured head.script.innerHTML is escaped

[xuexb]

Version

v2.1.0

Reproduction link

https://codesandbox.io/s/7432lomjpx

Steps to reproduce

nuxt.config.js

module.exports = {
    mode: 'universal',

    /*
     ** Headers of the page
     */
    head: {
        script: [
            { innerHTML: 'document.documentElement.classList.add("theme-" + (localStorage.theme || "day"))' },
        ],
    },
    ....
}

What is expected ?

' and " are displayed correctly

What is actually happening?

<script data-n-head="true" >document.documentElement.classList.add(&quot;theme-&quot; + (localStorage.theme || &quot;day&quot;))</script>

_{This bug report is available on Nuxt community (#c7936)}

[manniL]

This is an intended feature of vue-meta. You can disable it as well if you want. More information in the vue-meta docs. In-production example here

[yugasun]

@xuexb When you want to inject script into template by parameter head.script in nuxt.config.js, and add __dangerouslyDisableSanitizers: ['script'], can solve your problem. But, I think customizing your template is a better method. After you do this, you can write any script you want in your HTML document.
Relative issue https://github.com/nuxt/nuxt.js/issues/2230

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.