rollup-plugin-static-import

1.0.0 verified Mon Apr 27 auth: no javascript

Rollup plugin that copies imported files (e.g., SVG, SCSS) to the output directory while marking them as external in the bundle. Version 1.0.0 rewrites in TypeScript with type declarations. Best used with rollup's preserveModules option to keep imports tree-shakable. Unlike generic copy plugins, it integrates with rollup's watch mode and handles asset re-imports. Requires rollup ^1.20.0 || ^2.0.0 || ^3.0.0.

Common errors

error Error [ERR_REQUIRE_ESM]: require() of ES Module /path/to/rollup-plugin-static-import/dist/index.js from /path/to/rollup.config.js not supported. ↓

cause Package is ESM-only since v1.0.0; CommonJS require() cannot load it.

fix

Use import syntax in your config file (if rollup supports it) or switch to dynamic import: const staticImport = (await import('rollup-plugin-static-import')).default;

error TypeError: staticImport is not a function ↓

cause Named import instead of default import: import { staticImport } from 'rollup-plugin-static-import'

fix

Use default import: import staticImport from 'rollup-plugin-static-import'

error The plugin staticImport did not output any files under output dir. (No files to copy?) ↓

cause include globs matched no files, or baseDir/resolveRoot misconfigured.

fix

Verify that include patterns match files relative to projectRoot (default cwd) or adjust projectRoot option.

Warnings

gotcha Using staticImport without preserveModules: true may produce non-tree-shakable bundles where all assets are inlined into a single chunk. ↓

fix Set preserveModules: true in rollup config.

deprecated The 'include' option is required; omitting it will cause a runtime error. ↓

fix Always provide include with at least one glob pattern.

breaking v1.0.0 switched to ESM-only output. CommonJS require() will throw ERR_REQUIRE_ESM. ↓

fix Use dynamic import() or configure your bundler to handle ESM. If using CommonJS, stay on v0.x.

gotcha Plugin copies files based on import paths relative to baseDir; incorrect baseDir leads to wrong output paths. ↓

fix Set baseDir to the directory relative to which you want files copied. Default is 'src'.

Install

npm install rollup-plugin-static-import

yarn add rollup-plugin-static-import

pnpm add rollup-plugin-static-import

Imports

default
wrong
```
const staticImport = require('rollup-plugin-static-import')
```
correct
```
import staticImport from 'rollup-plugin-static-import'
```
ESM-only; CommonJS require will fail because the package exports only ESM since v1.0.0. Use dynamic import or configure bundler to handle it.

StaticImportOptions

wrong

import { StaticImportOptions } from 'rollup-plugin-static-import'

correct

import type { StaticImportOptions } from 'rollup-plugin-static-import'

Type-only export; importing as value will be undefined at runtime. Use 'import type' in TypeScript.

Plugin
wrong
```
import { Plugin } from 'rollup-plugin-static-import'
```
correct
```
import { Plugin } from 'rollup'
```
rollup-plugin-static-import does not re-export rollup types; get Plugin from rollup itself.

Quickstart

Configures rollup to copy SVG and SCSS files from src to dist, marking them as external so the consuming app bundles them.

// rollup.config.js
import staticImport from 'rollup-plugin-static-import';

export default {
  input: 'src/index.js',
  preserveModules: true,
  output: {
    dir: 'dist',
    format: 'esm'
  },
  plugins: [
    staticImport({
      include: ['src/**/*.svg', 'src/**/*.scss'],
      exclude: ['src/**/*.test.*'],
      baseDir: 'src'
    })
  ]
};