Codemod to localize global styles
npm install ember-codemod-remove-global-styles
_Codemod to localize global styles_
Moving from global styles to CSS modules can be tedious and error-prone. Run this codemod to get started.
The codemod:
- Statically analyzes code (no need to build projects)
- Supports v1 apps (classic, Webpack), v2 apps (Vite)
- Light and fast
Step 1. Quickly migrate.1,2
``sh`
cd
pnpx ember-codemod-remove-global-styles
Step 2. Review the package.
- [x] Fix format and lint errors.3
- [x] Run tests.
1. The codemod assumes that your apps and addons follow the Octane layout (flat or nested). If not, you can run codemods to move away from classic and pod.
2. The codemod assumes a single CSS file, where you have defined all global styles that you own. You can obtain such a file by exploring the dist/assets folder.
3. If you need lint configs that support *.module.css, you can install packages from @ijlee2-frontend-configs.
You must pass --src to indicate the location of your global stylesheet.
`sh`
pnpx ember-codemod-remove-global-styles --src app/assets/app.css
By default, the codemod considers components and routes. Pass --convert to consider a subset of these.
`shComponents only
pnpx ember-codemod-remove-global-styles --convert components
Optional: Limit folders to consider
By default, the codemod considers all files and folders for components and routes. Pass
--folder to limit the search to 1 folder. (You may use glob patterns to specify multiple folders.)`sh
ui folder only (search app/{components,templates}/ui)
pnpx ember-codemod-remove-global-styles --folder uiui/form folder only (search app/{components,templates}/ui/form)
pnpx ember-codemod-remove-global-styles --folder ui/formroute1 and route2 folders only (search app/templates/{route1,route2})
pnpx ember-codemod-remove-global-styles --convert routes --folder "{route1,route2}"
`
Optional: Specify the project root
Pass
--root to run the codemod somewhere else (i.e. not in the current directory).`sh
pnpx ember-codemod-remove-global-styles --root
`
$3
The codemod is designed to cover typical cases. It is not designed to cover one-off cases.
To better meet your needs, consider cloning the repo and running the codemod locally.
`sh
cd Compile TypeScript
pnpm buildRun codemod
./dist/bin/ember-codemod-remove-global-styles.js --root
``- Node.js v20 or above
See the Contributing guide for details.
This project is licensed under the MIT License.