vue.jswebpacknuxt.jssubresource-integrity

webpack-intergrity-subresource don't make any effect


I'm trying to apply the plugin to my nuxtjs's webpack to enable subresource integrity. Here is my nuxt.config.js

 extend(config) {
      config.output!.crossOriginLoading = "anonymous";
    },
    plugins: [
      new SriPlugin({
        hashFuncNames: ["sha256", "sha512"],
      }),
    ],

no error is emitted, but when I view the DOM, the script tag didn't change. I expected the script tag to look like this, since the webpack plugin already running.

<script src="/_nuxt/app.js" integrity="sha256-QcoWoREdQOlM2GAA/i4qmOYRMED/cckK1XPNKTCVh9g= sha512-S163FQo9fj70zvaK4IouYKyk2O2jyKGNimr/z6SJD6xHeN7p4sQOS979HKwDhpXTS7OUegEleaP1q/K6qjVjxw==" crossorigin="anonymous">

I tried to debug and logging in the package's source code but nothing go wrong. In both webpack-intergrity-subresource and html-webpack-plugin, the script tag looked as my expect, but when they came to browser, they looked different

my versions:

"nuxt": "^2.15.8", ("@nuxt/webpack": "2.15.8")
"webpack-subresource-integrity": "1.5.2"

Solution

  • nuxtjs only use html-webpack-plugin to inject resource in Static Site Generation, for ssr they do it themself. So basically we can only enable subresource integrity when in static mode.

    nuxt's ssr renderer