Getting Started

Install

npm i -D vite-plugin-sri-gen

Quick Start

The minimal configuration — add the plugin and you're done:

// vite.config.ts
import sri from 'vite-plugin-sri-gen'

export default {
  plugins: [sri()],
}

All options have sensible defaults. When you need to tune things, here's the full annotated form:

// vite.config.ts
import sri from 'vite-plugin-sri-gen'

export default {
  plugins: [
    sri({
      algorithm: 'sha384',        // 'sha256' | 'sha384' | 'sha512' (default: 'sha384')
      crossorigin: 'anonymous',   // 'anonymous' | 'use-credentials' | undefined
      fetchCache: true,           // cache remote fetches in-memory and dedupe concurrent requests (default: true)
      fetchTimeoutMs: 5000,       // abort remote fetches after N ms; 0 disables timeout (default: 5000)
      skipResources: [],          // skip SRI for resources matching these patterns (default: [])
      verboseLogging: true,       // show all info-level build logs (default: false)
    }),
  ],
}

See Options for the full reference, including importMapIntegrity, preloadDynamicChunks, and runtimePatchDynamicLinks.

What You Get

Running vite build with this plugin produces HTML where every relevant tag carries a computed integrity hash:

• Scripts, stylesheets, and modulepreload links already present in your HTML get integrity (and crossorigin, if configured) added automatically. See Coverage Strategies.
• import map integrity — an injected <script type="importmap"> declares hashes for the JS modules reached through the module graph (not already covered by a tag's own integrity), giving supported modern browsers native SRI enforcement over both static and dynamic module imports. Builds with no code splitting need no import map at all. Import maps must be inline, so a script-src without 'unsafe-inline' blocks this one — set importMapIntegrity: false to deliver the same hashes as modulepreload links instead. See Import Map Integrity.
• Modulepreload injection for lazy chunks — the plugin scans Rollup output for dynamically imported chunks and injects <link rel="modulepreload" integrity=...> links into each HTML file, so lazy chunks are preloaded with verified hashes. See Coverage Strategies.
• CSP-safe runtime patching of dynamic tags — a tiny runtime prepended to entry chunks intercepts dynamically created <script> and <link> elements and adds the appropriate integrity and crossorigin attributes before the browser makes the request. See Runtime Patching.
• Vite manifest augmentation — when build.manifest: true is set, the plugin adds integrity and cssIntegrity fields to each manifest entry so backends that own HTML generation can attach integrity without re-hashing the files. See Backend-Owned HTML (Manifest).

Requirements & Compatibility

Project type	Status
SPA	Supported — generateBundle processes the emitted HTML file
MPA	Supported — generateBundle scans all emitted .html files
Prerendered SSG	Supported — any .html files emitted during the build are processed
Pure SSR (no HTML emitted)	Manifest only — see SSR, SSG & Prerendering

Additional requirements:

• Node ≥ 18 — the plugin uses the global fetch API introduced in Node 18.
• ESM-only — import with import sri from 'vite-plugin-sri-gen'. CommonJS require() is not supported.
• Vite ≥ 4 — declared as a peer dependency; Vite 5, 6, 7, and 8 (Rolldown) are all supported.
• Build-only — SRI is intentionally disabled during vite dev. See Dev Mode for why.

Next Steps

• What is Subresource Integrity? — the security background behind this plugin
• Options — every configuration option explained
• Limitations — known edge cases and constraints