importmap-plugin

0.8.0 verified Mon Apr 27 auth: no javascript

Rollup/Vite plugin for generating import maps for SystemJS or ES module outputs. Current stable version 0.8.0. Designed to work exclusively with Rollup's output plugins, it maps module chunks to URLs in an import map and injects the map into an HTML file. Key differentiators: supports both SystemJS and ES module formats, integrates with Vite's build pipeline. Note: this is a proof-of-concept with limited API surface and no active release cadence.

Common errors

error Error: Could not resolve 'importmap-plugin' ↓

cause Package not installed or missing from package.json.

fix

npm install importmap-plugin

error TypeError: ImportmapPlugin is not a function ↓

cause Named import used instead of default import.

fix

Use import ImportmapPlugin from 'importmap-plugin'

Warnings

gotcha Plugin must be placed inside Rollup output.plugins, not top-level plugins array. ↓

fix Move ImportmapPlugin into output.plugins as shown in the quickstart.

gotcha entryFileNames and chunkFileNames must not include hash placeholders like [hash]; otherwise import map generation fails. ↓

fix Omit [hash] from entryFileNames and chunkFileNames.

gotcha external option only works for SystemJS format; for ES modules set external to false and handle external imports separately. ↓

fix Set external: true only when format is 'system'.

deprecated Proof-of-concept; may not be maintained or receive updates. ↓

fix Consider alternatives or fork if needed.

Install

npm install importmap-plugin

yarn add importmap-plugin

pnpm add importmap-plugin

Imports

default

wrong

const ImportmapPlugin = require('importmap-plugin')

correct

import ImportmapPlugin from 'importmap-plugin'

ESM-only package; default export is the plugin function.

ImportmapPlugin

wrong

import { ImportmapPlugin } from 'importmap-plugin'

correct

import ImportmapPlugin from 'importmap-plugin'

Named export not available; use default import.

type ImportmapOptions
```
import type { ImportmapOptions } from 'importmap-plugin'
```
TypeScript type exported for plugin options.

Quickstart

Configures Vite to use importmap-plugin for generating an import map in SystemJS format with external imports enabled.

// vite.config.ts
import { defineConfig } from 'vite';
import ImportmapPlugin from 'importmap-plugin';

export default defineConfig({
  build: {
    rollupOptions: {
      output: {
        format: 'system',
        entryFileNames: 'app/index.js',
        chunkFileNames: 'chunks/[name].js',
        plugins: [
          ImportmapPlugin({
            base: '/',
            external: true,
            indexHtml: 'index.html',
          }),
        ],
      },
    },
  },
});