Skip to content

Use localByDefault plugin for both local and global behaviours.#130

Merged
madyankin merged 2 commits intomadyankin:masterfrom
fxb:patch-1
Feb 23, 2022
Merged

Use localByDefault plugin for both local and global behaviours.#130
madyankin merged 2 commits intomadyankin:masterfrom
fxb:patch-1

Conversation

@fxb
Copy link
Copy Markdown
Contributor

@fxb fxb commented Feb 11, 2022

The postcss-modules-local-by-default plugin actually has the modes local, global and pure (link).

If the plugin is NOT added in the global case, shorthand selectors (link) will result in an error.

Shorthand selectors are actually quite useful in SCSS with nesting.

SCSS

:local {
  .foo {
    color: red;
  }

  .bar {
    color: blue;
  }
}

CSS

:local .layer {
  color: red;
}

:local .bar {
  color: blue;
}

The resulting error message (without using the plugin) is:

Unexpected comma (",") in :local block

Adding the postcss-modules-local-by-default plugin with the correct global mode will enable this syntax.


I created this first commit directly on github.com. I can add some test cases to this PR later.

@fxb
Copy link
Copy Markdown
Contributor Author

fxb commented Feb 21, 2022

@madyankin I've added tests for the change now.

@madyankin madyankin merged commit a400e14 into madyankin:master Feb 23, 2022
@madyankin
Copy link
Copy Markdown
Owner

@fxb thank you Felix! Published. Sorry for keeping you waiting so long

@fxb
Copy link
Copy Markdown
Contributor Author

fxb commented Feb 23, 2022

Thanks a lot! No worries :)

@fxb fxb deleted the patch-1 branch February 23, 2022 16:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants