Babel presets for modern browsers
Babel presets for modern browsers
Use @babel/preset-env
instead with configured browserslists
:
package.json
{
"browserslist": {
"modern": [
"defaults and supports es6-module"
]
},
}
babel.config.json
{
- "presets": ["modern-browsers"]
+ "presets": [["@babel/preset-env", {
+ "shippedProposals": true,
+ "bugfixes": true,
+ "browserslistEnv": "modern"
+ }]]
}
https://babeljs.io/docs/babel-preset-env
This preset covers syntax of es2015
, es2016
, es2017
, es2018
, es2019
and es2020
.
More info in the compatibility table below
Since v12, this package requires @babel/[email protected]
. If you use babel 6, you can still use the version "11.0.1" of this package. If you want to migrate, you can read the announcement and the official migration guide.
targets.esmodules
If you don't need preset-env, using this package will only install a few dependencies.
npm install --save-dev babel-preset-modern-browsers @babel/core
Add the following line to your .babelrc
file:
{
"presets": ["modern-browsers"]
}
loose
: Enable “loose” transformations for any plugins in this preset that allow them (Disabled by default).modules
- Enable transformation of ES6 module syntax to another module type (Enabled by default to "commonjs"). Can be false to not transform modules, or "commonjs"shippedProposals
- Enable features in stages but already available in browsers (Enabled by default){
presets: [['modern-browsers', { loose: true }]];
}
{
presets: [[require('babel-preset-modern-browsers'), { loose: true }]];
}
Edge >= 83, Firefox >= 78, FirefoxAndroid >= 78, Chrome >= 80, ChromeAndroid >= 80, Opera >= 67, OperaMobile >= 67, Safari >= 13.1, iOS >= 13.4
Feature | Edge | Firefox | Chrome | Opera | Safari |
---|---|---|---|---|---|
Shipped Proposals |
|||||
Numeric Separators | |||||
↳ syntax-numeric-separator | |||||
ES2020 |
|||||
Optional chaining (?. ) |
|||||
Nullish Coalescing operator (?? ) |
|||||
ES2019 |
|||||
Optional catch binding | |||||
JSON strings | |||||
ES2018 |
|||||
Object Rest/Spread Properties | |||||
RegExp Unicode Property Escapes | |||||
Asynchronous Iterators | |||||
ES2017 |
|||||
trailing commas in function | |||||
async function | |||||
ES2016 |
|||||
exponentiation operator | |||||
ES2015 |
|||||
Syntax |
|||||
default parameters | |||||
rest parameters | |||||
spread | |||||
computed properties | |||||
shorthand properties | |||||
for...of |
|||||
template string | |||||
Regexp sticky | |||||
Regexp unicode | |||||
destructuring | |||||
Unicode Strings | |||||
Octal/Binary Numbers | |||||
Bindings |
|||||
const |
|||||
let |
|||||
block-level function declaration |
|||||
Functions |
|||||
arrow functions | |||||
classes | |||||
super | |||||
generators | |||||
Built-ins |
|||||
typeof Symbol | |||||
Built-in extensions |
|||||
function name |
Feature | Edge | Firefox | Chrome | Opera | Safari |
---|---|---|---|---|---|
Static & Instance Class Fields | |||||
↳ proposal-class-properties | |||||
Private Class Methods | |||||
↳ proposal-private-methods |