Search code examples
reactjswebstormcss-modulesreact-css-modules

Next.js automatic class completion for CSS modules in WebStorm?


Is there any way to add automatic class completion for CSS modules in IntelliJ IDEA's apps?

I use WebStorm and currently developing a project on Next.js (React).

I used to write something like div.avatar and press the TAB key so IDE will convert my code to <div class="avatar"></div>. I wonder whether this is possible for CSS modules because right now, I need to rewrite each CSS class manually.

enter image description here


Solution

  • I used to write something like div.avatar and press the TAB key so IDE will convert my code to <div class="avatar"></div>

    That's a standard Emmet functionality. You cannot customize this behaviour in WebStorm.

    https://youtrack.jetbrains.com/issue/WEB-52596 -- watch this ticket (star/vote/comment) to get notified on any progress. I suggest you do that so the devs know that it's a needed functionality (to bump the priority: no votes means no users interested in this).