Webpack - package: @babel/polyfill has been deprecated - How to use an alternative?

Question

I came back to my Webpack 4 configuration and all the packages after 4 months. It always surprises me how fast a package get\'s updated or deprecated.

I have this p

Answer 1

core-js is currently replacing bable-polyfill. You do not have to set it anywhere except for the .babelrc file I have a question, why do you duplicate libraries you have @babel/polyfill andbabel-pollyfill the same applies to @babel/preset-env andbabel-preset-en. You have declared in .babelrc corejs but I do not see that package.json has been installed?

My example may not be perfect but I try to strive for it :)

.babelrc

{
 "presets": [
   [
    "@babel/preset-env",
    {
     "useBuiltIns": "usage",
     "corejs": 3
    }
   ]
  ]
}

package.json

"devDependencies": {
  "@babel/core": "^7.5.5",
  "@babel/preset-env": "^7.5.5",
  "babel-loader": "^8.0.6",
  "core-js": "^3.1.4" // this is now your polyfill
  ...
}

webpack,config.js

entry: {
  app: './index.js',
},

index.js

import './style.scss';
import module from './module.js';
...

UPDATE

add to package.json, you can prepare your own list of supported browsers browserl.ist

"browserslist": [
  "last 2 version",
  ">1%",
  "not dead"
],

add to .babelrc

{
  "debug": true,
  "useBuiltIns": "usage",
  "corejs": 3
}

After all these additional changes in the console will appear what browsers are supported and what pollyfill have been added. And of course the most important thing is to test it in IE11. I always test on 6-7 desktop and 3-4 mobile browsers.