Registry / devops / js-css-migration

js-css-migration

library2.0.0jsnpmunverified

A CLI tool that automates migrating React/Next.js projects from Styled Components to CSS Modules by converting styles.js files to styles.module.css, extracting styles, refactoring JSX to use CSS class names, and removing Styled Component imports. Stable version 2.0.0, no recent updates (likely abandoned). Aids large codebase transitions with one command, but lacks documentation and error handling for edge cases like dynamic styles, themes, or TypeScript.

devops

npm install js-css-migration

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · JS-CSS-MIGRATION

js-css-migration

devopsjavascriptv2.0.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

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

js-css-migration

✓ npx js-css-migration migrate ./src/components

✗ npm run migrate (without specifying path)

CLI tool, not imported in code. Use npx or global install.

migrate

✓ js-css-migration migrate <path>

✗ js-css-migration <path> (missing migrate subcommand)

The only command is 'migrate'. Must provide folder path or default to ./src/components.

npm script

✓ node node_modules/.bin/js-css-migration migrate <path>

✗ npm run migrate (without adding script to package.json)

If not installed globally, add script 'migrate': 'js-css-migration migrate' to package.json.

Shows global installation and basic migration commands for a folder or default directory.

# Install globally npm install -g js-css-migration # Migrate a specific folder js-css-migration migrate ./src/components/button # Migrate entire components directory (default path) js-css-migration migrate ./src/components

Debug

Known issues

deprecatedPackage has not been updated since 2021, no compatibility with modern Next.js or React versions.

fix

Consider using codemods like @emotion/css or manual migration.

affects: >=2.0.0

gotchaOnly works with styled-components v5 patterns; may not handle tagged template literals or complex styling.

fix

Review generated files manually; the tool may produce syntactically incorrect CSS or JSX.

affects: >=1.0.0

gotchaDefault path is ./src/components; running without arguments on wrong directory structure may fail silently.

fix

Always specify an absolute or relative path to the folder containing components.

affects: >=1.0.0

gotchaDoes not support TypeScript or .tsx files; may strip type annotations or break.

fix

Convert .tsx to .jsx before migration or manually refactor.

affects: >=1.0.0

gotchaNo undo capability; backs up nothing. Irreversible changes to your source files.

fix

Commit or stash changes before running the command.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'js-css-migration'

Package not installed or not globally accessible.

fix

npm install -g js-css-migration or use npx js-css-migration

SyntaxError: Unexpected token (maybe from styled component interpolation)

Styled Components with dynamic styles using props: ${props => ...}.

fix

Replace dynamic styles manually before migration, or post-process CSS.

Error: ENOENT: no such file or directory, stat '/some/path'

Provided folder path does not exist.

fix

Check folder path and ensure components are present.

Upgrade

Version history

2.0.0latest on npm

Audit

Dependencies

reactrequiredExpected to be present in the project being migrated; analyzes JSX.

next.jsoptionalTargeted for Next.js projects due to built-in CSS Modules support.

Agent activity

11 hits · last 30 days

node

Resources

githubhttps://github.com/demetcaliskan/js-css-migration ↗

packagejs-css-migration ↗

homepagehttps://github.com/demetcaliskan/js-css-migration#readme ↗