Search code examples
javascripthttpecmascript-6

Is it possible to use subresource integrity with ES6 module imports?

Given code like this:

import { el, mount } from 'https://unpkg.com/[email protected]/dist/redom.es.js';

is there some way to enable subresource integrity verification to ensure that the CDN asset returns the expected content?

Solution

  • This can now be done via Import Maps in Chrome 127+ and in the upcoming Safari 18.

    <script type="importmap">
{
  "integrity": {
    "./module/shapes/square.js": "sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
  }
}
</script>

    See more details in https://shopify.engineering/shipping-support-for-module-script-integrity-in-chrome-safari

    In my previous answers I mentioned also using a link tag but support may be spotty:

    <script type="module" integrity="..." src="https://unpkg.com/[email protected]/dist/redom.es.js">
Wh