Permalink
Switch branches/tags
Find file Copy path
70 lines (61 sloc) 1.73 KB
title
Babel

Gatsby uses the phenomenal project Babel to enable support for writing modern JavaScript — while still supporting older browsers.

How to specify which browsers to support

Gatsby supports by default the last two versions of major browsers, IE 9+, as well as any browser that still as 1%+ browser share.

This means we automatically compile your JavaScript to ensure it works on older browsers. We also automatically add polyfills as needed — no more shipping code which mysteriously breaks on older browsers!

If you only target newer browsers, see the Browser Support docs page for how to instruct Gatsby on which browsers you support and then Babel will start compiling for only these browsers.

How to use a custom .babelrc file

Gatsby ships with a default .babelrc setup that should work for most sites. If you'd like to add custom Babel presets or plugins, we recommend copying our default .babelrc below to the root of your site and modifying it per your needs.

{
  presets: [
    [
      "@babel/preset-env",
      {
        loose: true,
        modules: false,
        useBuiltIns: "usage",
        shippedProposals: true,
        targets: {
          browsers: [">0.25%", "not dead"],
        },
      },
    ],
    [
      "@babel/preset-react",
      {
        useBuiltIns: true,
        pragma: "React.createElement",
      },
    ],
  ],
  plugins: [
    [
      "@babel/plugin-proposal-class-properties",
      {
        loose: true,
      },
    ],
    "@babel/plugin-syntax-dynamic-import",
    "babel-plugin-macros",
    [
      "@babel/plugin-transform-runtime",
      {
        helpers: true,
        regenerator: true,
      },
    ],
  ],
}