# postcss-remove-nested-calc

> PostCSS plugin to remove nested calc() for ie11 compatibility

Latest version **1.0.3** (published 2021-05-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install postcss-remove-nested-calc
pnpm add postcss-remove-nested-calc
yarn add postcss-remove-nested-calc
bun add postcss-remove-nested-calc
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2021-05-16 |
| First published | 2020-06-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=8.0.0 |
| Dependencies | 1 |
| Unpacked size | 18.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 6 |
| Author | Nico Jacobs |
| Maintainers | njabln |
| Keywords | postcss, css, postcss-plugin, calc(), IE11 |

## Links

- npm: https://www.npmjs.com/package/postcss-remove-nested-calc
- Repository: https://github.com/nico-jacobs/postcss-remove-nested-calc
- Homepage: https://github.com/nico-jacobs/postcss-remove-nested-calc#readme
- Issues: https://github.com/nico-jacobs/postcss-remove-nested-calc/issues
- npm.io page: https://npm.io/package/postcss-remove-nested-calc

## Dependencies (1)

- [postcss](https://npm.io/package/postcss.md) ^8.2.15

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 1.0.3 (latest) — 2021-05-16
- 1.0.2 — 2020-06-13
- 1.0.1 — 2020-06-13

## README

# PostCSS Remove Nested Calc

[PostCSS] plugin to remove nested calc() for ie11 compatibility.

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


E.g. Zach Handing [wrote about it on codepen], and I had a very similar problem.

[wrote about it on codepen]: https://codepen.io/zachhanding/post/nested-calc-functions-and-ie11

This will cause problems in IE11
```css
.foo {
    width: calc(100vw - calc(20% - 10px));
}
```


This will not:
```css
.foo {
  width: calc(100vw - (20% - 10px));
}
```

## Install 


```bash
$ npm install postcss-remove-nested-calc --save-dev
```

## Usage

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 already use PostCSS, add the plugin to plugins list:

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

```
Or for Webpack
```diff
module.exports = {
    target: 'web',
    mode: (process.env.APP_ENV === 'production') ? 'production' : 'development',
    devtool: (process.env.APP_ENV === 'production') ? false : 'inline-source-map',
    entry: {
    },
    module: {
        rules: [
            {
                test: /\.scss$/,
                use: [
                    {
                        loader: 'postcss-loader',
                        options: {
                            ident: 'postcss',
                            plugins: (loader) => [
+                                require('postcss-remove-nested-calc'),
                                require('autoprefixer')
                            ],
                        }
                    },
                ]
            },
            
        ]
    }
};
```

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

## Built With

[js-plugin-starter-kit](https://github.com/course-one/js-plugin-starter-kit)

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

## Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
To all the JS RegEx Ninjas out there, this project might have some room for improvement ;)

Please make sure to update tests as appropriate.

## Authors

Nico Jacobs

## License

This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details

---
_Source: https://npm.io/package/postcss-remove-nested-calc · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._