question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Nicer css module generated names

See original GitHub issue

You may not even realize this, but your current config supports css modules, it just doesn’t use them by default – i.e. you can use :local in CSS files and it will generate class names, it just doesn’t make all class selectors local by default.

I’m totally fine with global being the default scope for now (much less confusing for beginners) and adding the :local pseudo-class where I need it, but it would be nice if more human-readable classes were generated. Use something like:

style!css?localIdentName=[path][name]---[local]---[hash:base64:5]!postcss

as the loader config in webpack.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:9
  • Comments:40 (23 by maintainers)

github_iconTop GitHub Comments

102reactions
modernserfcommented, Jul 22, 2016

I regret bringing this to your attention.

26reactions
gaearoncommented, Jul 22, 2016

I don’t think we want to support this. I would actually like to turn this feature off.

The reason is we might want to migrate away from webpack in the future. We’d need to make our CSS files are as vanilla CSS as possible (aside from minor stuff like relative dependency paths).

I would accept a PR that forbids extra features if possible.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to give classes in CSS modules better names?
It works as expected, but the one small thing can be improved - names of classes generated. Is it possible to, say, add...
Read more >
A deep dive into CSS Module - LogRocket Blog
We can see that CSS Module dynamically generates unique class names, automating naming for our whole team.
Read more >
Why Google use random ClassName. What is CSS Modules
CSS Module makes CSS modularized. In other words, CSS class names are automatically transformed to the unique CSS class names and make the...
Read more >
What are CSS Modules and why do we need them?
CSS files in which all class names and animation names are scoped ... [the classes] are dynamically generated, unique, and mapped to the ......
Read more >
Chainable class names for CSS Modules in React - Sandro Roth
CSS Modules lets you write CSS that is scoped locally to your component. It makes your class names unique by adding a hash...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found