babel-plugin-transform-import-ignore

1.1.0 verified Sat Apr 25 auth: no javascript

Babel plugin to ignore specific imports (e.g., CSS, SCSS) in Node.js environments, commonly used for server-side rendering. Version 1.1.0 is the latest stable release. Alternates process Webpack's null-loader or similar approaches, but this plugin integrates directly into the Babel pipeline, allowing pattern-based or regex-based ignoring of side-effect imports. It only removes imports that have no assigned variable (e.g., import './style.css'), preserving variable imports. Simple configuration via patterns array with wildcard support.

Common errors

error TypeError: Cannot read properties of undefined (reading 'some') ↓

cause Missing or misconfigured patterns option in plugin config.

fix

Ensure the plugin config includes a 'patterns' array with at least one pattern.

Warnings

gotcha Only side-effect imports (no variable assignment) are ignored. Imports like import css from '...' are not affected. ↓

fix Ensure your import statements are without variable assignment for the plugin to remove them.

gotcha Wildcard patterns may not work as expected if not using proper glob syntax. Test patterns thoroughly. ↓

fix Use regex in babel.config.js for more precise matching.

Install

npm install babel-plugin-transform-import-ignore

yarn add babel-plugin-transform-import-ignore

pnpm add babel-plugin-transform-import-ignore

Imports

default (plugin)
```
plugins: [['babel-plugin-transform-import-ignore', { patterns: ['.css'] }]]
```
Plugin is added to Babel config, not imported directly in code.

Quickstart

Shows how to configure the plugin in babel.config.js to ignore .css, .scss, and .less imports that have no variable assignment.

// babel.config.js
module.exports = {
  presets: ['@babel/preset-env'],
  plugins: [
    ['babel-plugin-transform-import-ignore', {
      patterns: ['.css', '.scss', /^\.less$/]
    }]
  ]
};

// Example input (will be ignored):
import './style.css';

// Example output (empty):
// (nothing)

// Example input (will NOT be ignored):
import css from './style.css';
// Example output: unchanged
import css from './style.css';