Registry / web-framework / rollup-plugin-import-assert

rollup-plugin-import-assert

library3.0.1jsnpmunverified

A Rollup plugin that enables import assertions (formerly import attributes) for CSS and JSON modules, allowing developers to import stylesheets as constructible stylesheets and JSON modules with type assertions. Version 3.0.1 works with Rollup 3+ and requires acorn-import-assertions as a peer dependency. It transforms CSS imports into CSS module scripts for use with adoptedStyleSheets. Compared to alternatives like @rollup/plugin-json or raw CSS imports, this plugin provides standardized import assertion syntax as per the TC39 proposal, but only supports static imports with literal assertion values. It does not handle dynamic imports with dynamic expressions. The package ships TypeScript definitions.

web-framework

npm install rollup-plugin-import-assert

github ↗package ↗

INSTALL

IMPORT

SIG · ROLLUP-PLUGIN-IMPO

rollup-plugin-import-assert

web-frameworkjavascriptv3.0.1

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

importAssertionsPlugin

✓ import { importAssertionsPlugin } from 'rollup-plugin-import-assert'

✗ const importAssertionsPlugin = require('rollup-plugin-import-assert')

ESM-only package, no CommonJS support

importAssertions

✓ import { importAssertions } from 'acorn-import-assertions'

This is from the peer dependency, but commonly confused as part of the plugin. Must be installed separately.

default (plugin instance)

✓ import { importAssertionsPlugin } from 'rollup-plugin-import-assert'

✗ import importAssertionsPlugin from 'rollup-plugin-import-assert'

The package uses a named export, not default. Many users mistakenly use default import.

Shows how to install, configure Rollup with acorn-import-assertions and the plugin, and use import assertions for CSS modules.

// Install: npm i -D rollup-plugin-import-assert acorn-import-assertions // rollup.config.js import { importAssertionsPlugin } from 'rollup-plugin-import-assert'; import { importAssertions } from 'acorn-import-assertions'; export default { input: 'src/index.js', output: { format: 'esm', dir: 'dist', }, acornInjectPlugins: [importAssertions], plugins: [importAssertionsPlugin()], }; // src/index.js import styles from './styles.css' assert { type: 'css' }; class MyElement extends HTMLElement { connectedCallback() { this.attachShadow({ mode: 'open' }).adoptedStyleSheets = [styles]; } } customElements.define('my-element', MyElement);

Debug

Known issues

breakingRequires Rollup 3+; not compatible with Rollup 2

fix

Upgrade Rollup to version 3 or later, or use older versions of this plugin (not specified).

affects: >=3.0.0

gotchaDynamic imports with dynamic expressions (e.g., import(`./${name}.json`)) are silently ignored

fix

Use static imports or ensure the import path is a string literal for assertions to work.

affects: all

deprecatedImport assertions are being renamed to 'import attributes' in the TC39 proposal; future ECMAScript versions may use 'with' instead of 'assert'

fix

Watch for future updates; may need to use 'with' syntax in newer versions.

affects: all

gotchaCSS module script API (adoptedStyleSheets) is only natively supported in Chromium browsers; requires polyfill for other browsers

fix

Install construct-style-sheets-polyfill for cross-browser support.

affects: all

Errors

Common errors & fixes

Error: Cannot find module 'acorn-import-assertions'

Missing peer dependency acorn-import-assertions

fix

npm install -D acorn-import-assertions

The requested module 'rollup-plugin-import-assert' does not provide an export named 'default'

Using default import when plugin exports named export

fix

Change import to: import { importAssertionsPlugin } from 'rollup-plugin-import-assert'

[!] Error: Cannot use import assertion with dynamic import with dynamic expression

The plugin ignores dynamic imports with template literals or variables

fix

Use a static import with assert syntax or avoid dynamic expressions in the import path.

Upgrade

Version history

3.0.1latest on npm

Audit

Dependencies

acorn-import-assertionsrequiredRequired to parse import assertion syntax in Rollup's Acorn parser

rolluprequiredPeer dependency; plugin works with Rollup 3+

Agent activity

10 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/calebdwilliams/rollup-plugin-import-assert ↗

packagehttps://www.npmjs.com/package/rollup-plugin-import-assert ↗