babel-plugin-remove-style

0.1.0 verified Fri May 01 auth: no javascript

A Babel plugin that removes `style` props from React JSX elements, primarily used to simplify snapshot testing by excluding inline styles. Version 0.1.0 is the current and only stable release. It operates as a Babel transform, stripping style attributes during transpilation. Unlike mocking CSS modules or disabling style processing, this plugin provides a brute-force removal without side effects. Developed by Hylozoic, it targets test environments where style details are irrelevant. No updates since initial release; minimal community adoption.

Common errors

error Plugin not found: 'remove-style' ↓

cause Babel config uses short name 'remove-style' but package is 'babel-plugin-remove-style'. Babel only auto-resolves 'babel-plugin-' prefix for official or well-known plugins.

fix

Use full package name: ['babel-plugin-remove-style']

error TypeError: .default is not a function ↓

cause ESM import syntax used for CJS plugin.

fix

Use require('babel-plugin-remove-style') or in .babelrc as string.

Warnings

gotcha Plugin removes all style props unconditionally; no selective removal or options. ↓

fix Use only in test environment; not for production builds.

gotcha Jest caches transpiled code; may need --no-cache flag after installing plugin. ↓

fix Run jest with --no-cache or clear cache manually.

Install

npm install babel-plugin-remove-style

yarn add babel-plugin-remove-style

pnpm add babel-plugin-remove-style

Imports

default

wrong

import plugin from 'babel-plugin-remove-style'

correct

module.exports = require('babel-plugin-remove-style')

CJS-only; no ESM export. Use require in Babel config.

Quickstart

Configures the plugin to remove style props in test environment, showing JSX transformation.

// .babelrc or babel.config.js
{
  "env": {
    "test": {
      "plugins": ["babel-plugin-remove-style"]
    }
  }
}

// input.jsx
const Comp = () => <div style={{ color: 'red' }}>hi</div>;
// output.jsx
const Comp = () => <div>hi</div>;