reactjscreate-react-appwebpack-4babel-loaderreact-app-rewired

How to drop support for IE, and prevent babel transpilation to ES5 in order to gain performance gain


Currently I am using default webpack config of Create React App for babel transpilation. It seems that default babel-loader (in CRA config) uses "babel-preset-react-app". Now all I want is to prevent the transpilation of JS files to ES5 since I don't need to support Internet Explorer. I'm hoping this will bring some gain in the build time.

Versions being used:


Solution

  • You can set the browserslist configuration in your package.json to set the target browsers.

    {
     ...
     "browserslist": {
         ">0.2%",
          "not dead",
          "not IE 11"
       }
    }
    

    You can also generate build as per your environment

    "browserslist": {
       "production": [
          ">0.2%",
          "not dead",
          "not IE 11"
        ],
        "development": [
          "last 1 chrome version",
          "last 1 firefox version",
          "last 1 safari version"
        ]
      }
    }
    

    This is also mentioned in the official CRA doc.

    I'd suggest taking a look at browserslist to customize the rules as per your exact requirements.