Repository navigation
[Discussion] Deprecate :local #308
Description
In my mind, it makes more sense to consider local-scope (and CSS Modules by extension) as something that's always on or always off.
I'm seeing a lot of folks hitting the problem where they enable ?modules and then want to include non-local CSS (e.g. #253) but never in the same file. I think @chrislloyd's suggestion in #287 is a better approach, so you can configure two instances of css-loader, one local and one global, maybe having ".module.css" be local and ".css" be global (like gatsbyjs/gatsby#193).
In global CSS files, then, I don't see any reason to keep :local, except that that was how CSS Modules got started in the first place. But I'm interested in having a discussion about this because I want to know if anyone's still using :local and feels it should be kept.
Activity
joshwnj commentedon Jul 27, 2016
I agree, we can reduce some confusion by having 1 less keyword.
I can see a (rare) use case for wanting to opt-out within a css module by using
:global, but I haven't come across any place where it makes sense to opt-in to:localwithin a css file intended to be global.gaearon commentedon Jul 28, 2016
We also have this problem in https://github.com/facebookincubator/create-react-app: we intentionally don’t support CSS modules but people work around this by using
:local. Which means changes to our CSS pipeline could break them in the future.markdalgleish commentedon Jul 29, 2016
I think we should deprecate it. It's totally vestigial, not something that we should encourage people to use going forward.
geelen commentedon Jul 29, 2016
Cool. I'll make a PR.
Remove CSS Modules postcss plugins in Global mode
Jessidhia commentedon Aug 16, 2016
I actually have an instance in my css-modules-using code where I had to use
:global .global-selector :local .local-selector; the case itself is a bit strange, and really should be avoided in "proper" code, but removing:localmight make incremental adoption of modules in existing codebases harder.I am definitely not using
:localin any files that are not local-by-default, though; only to override when nested inside a:global.tiagocpontesp commentedon Jan 22, 2017
It's late. Perhaps I'm not reading this correctly.
I've had to turn off the modules option to achieve this pattern for my components:
I noticed some suggestions of sprinkling
:globals on nested selectors within:locals-by-default, but it didn't seem to work, and seems less legible (several nested, vs one parent).If this PR goes against this, here's my -1.
alexander-akait commentedon Feb 15, 2018
Thanks everyone, it is out of scope
css-loader, please recreate issue in css modules repo, it is their rfc.