Ember-codemod-remove-ember-css-modules NPM

ember-codemod-remove-ember-css-modules

Codemod to replace ember-css-modules with embroider-css-modules

Features

The codemod helps you:

Remove ember-css-modules syntax from an Embroider app
Remove ember-css-modules syntax from a v2 addon

It preserves your code whenever possible.

Usage

You can find a migration example in ember-container-query.

Step 1. Quickly remove ember-css-modules syntax.1

cd <path/to/your/project>
npx ember-codemod-remove-ember-css-modules <arguments>

Manually remove the remaining instances of local-class attributes and {{local-class}} helpers.

Step 2. Update project configurations.2

Set up CSS modules (see the guides for apps and v2 addons).
Confirm that you can run all scripts in package.json.

1. Some prerequisites for running the codemod: First, migrate to the Octane layout (flat or nested). You can leverage codemods for classic and pod layouts. Second, refactor code to help the codemod update templates correctly.

2. Files such as .eslintrc.js, .prettierrc.js, .stylelintrc.js, .template-lintrc.js, ember-cli-build.js, package.json, postcss.config.js, tsconfig.json, etc.

Arguments

You must pass --type to indicate what type of project you have.

npx ember-codemod-remove-ember-css-modules --type app
npx ember-codemod-remove-ember-css-modules --type v2-addon

By default, an Embroider project has the flat component structure. Pass --component-structure to indicate otherwise.

npx ember-codemod-remove-ember-css-modules --component-structure nested

Pass --root to run the codemod on a project somewhere else (i.e. not in the current directory).

npx ember-codemod-remove-ember-css-modules --root <path/to/your/project>

Limitations

The codemod is designed to cover typical uses of ember-css-modules. It is not designed to cover one-off cases.

The codemod updates components only.

To better meet your needs, consider cloning the repo and running the codemod locally.

cd <path/to/cloned/repo>

# Compile TypeScript
pnpm build

# Run codemod
./dist/bin/ember-codemod-remove-ember-css-modules.js --root=<path/to/your/project>