@onereach/postcss-scoped-selector/README.md

PostCSS plugin for selector scoping

# postcss-scoped-selector

[PostCSS] plugin for selector scoping.

[PostCSS]: https://github.com/postcss/postcss

```css
.foo {
  background-color: red;
}
```

```css
:where([your-selector]) .foo, .foo:where([your-selector]) {
  background-color: red;
}
```

## Usage

**Step 1:** Install plugin:

```sh
npm install --save-dev postcss postcss-scoped-selector
```

**Step 2:** Check you project for existed PostCSS config: `postcss.config.js`
in the project root, `"postcss"` section in `package.json`
or `postcss` in bundle config.

If you do not use PostCSS, add it according to [official docs]
and set this plugin in settings.

**Step 3:** Add the plugin to plugins list:

```diff
module.exports = {
  plugins: [
+   require('postcss-scoped-selector'),
    require('autoprefixer')
  ]
}
```

[official docs]: https://github.com/postcss/postcss#usage