ember-css-modules icon indicating copy to clipboard operation
ember-css-modules copied to clipboard

Is there a codemod to colocate CSS modules with their components?

Open nelstrom opened this issue 3 years ago • 2 comments

We use ember-css-modules in our Ember app, and it's a great addon. Thanks for making it!

I tried running the ember-component-template-colocation-migrator on our codebase. The codemod moved our .hbs files from app/templates/components to app/components as intended. However, our CSS module files are still in the app/styles directory. Ideally we'd have these colocated in app/components alongside the .js and .hbs files.

Has anyone encountered this problem before? I'm wondering if there is a codemod that I could use to move our .css files into app/components? If not, I may have to write one myself.

nelstrom avatar Apr 20 '21 11:04 nelstrom

I don't know of one, but agreed it would be helpful!

Hopefully doing it for styles would be a bit simpler than the template migrator, since the latter has to account for potential cases where things that look like component templates are also used as partials and other odd cases like that.

dfreeman avatar Apr 20 '21 21:04 dfreeman

To answer my own question: Yes! There is (now) a codemod to colocate CSS modules with their components. We used this at Phorest for our Ember app, and successfully moved 400+ CSS files.

I hope this proves useful for someone else.

nelstrom avatar Aug 27 '21 14:08 nelstrom