@lego/browserslist-config-internal
browserslist configuration for internal projects, supporting the browsers supported by the internal IT organization
What is Browserslist?
Browserslist is a configuration to share your project's target browsers between different front-end tools.
- Browserslist (Github repo)
- browserl.ist (Browserslist query syntax validation)
- "Browserslist is a Good Idea" (blog post by @chriscoyier)
Installation
$ npm install --save-dev @lego/browserslist-config-internal
Usage
To get started, add this to your package.json file:
"browserslist": [
["extends @lego/browserslist-config-internal"]
]or add a .browserslistrc file which contains:
extends @lego/browserslist-config-internalLimitations
None
Tools that use Browserslist
Autoprefixer
Autoprefixer is a PostCSS plugin to add vendor prefixes to CSS. It adds only actual prefixes according to Browserslist’s target browsers and Can I Use data.
Babel
Babel is a tool to compile JS files. The most popular way to use it is to compile future JS syntaxes to JS supported by target browsers. From Babel 7.0 @babel/preset-env loads target browsers from the same Browserslist config.
PostCSS Preset Env
postcss-preset-env is a “Babel for CSS.” It compiles future CSS syntax to CSS supported by target browsers. It is similar to cssnext, but more accurate with CSS spec and has stage option.
PostCSS Normalize
Browsers have different default styles. To have same styles in all browsers we need to “normalize” these differences.
postcss-normalize is a fork of popular Normalize.css with 2 differents: it doesn’t have opinionated styles, and it adds only necessary fixes according Browserslist target browsers.
ESLint
ESLint finds mistakes in your JS. eslint-plugin-compat is a plugin to ESLint to warn that JS will not work in all target browsers.
Stylelint
Stylelint is a “ESLint for CSS” to warn you about mistakes in CSS. It also has stylelint-no-unsupported-browser-features plugin to warn you when CSS property will not work in all target browsers.