Add babel-preset-gatsby #8724

philipp-spiess · 2018-10-02T21:38:11Z

Part of #6170

This PR adds babel-preset-gatsby, a new package that exposes our babel config as a handy preset that we can re-use in all our internal packages as well as in public packages.

I've added a new option, targets, to overwrite the preset-env targets. You can see the changes in the updated Babel documentation.

In #6170, @DSchau mentioned that we want to replace babel-loader-helpers with this preset as well (eventually). I'm not really sure what this helper is doing right now so I decided to not touch it. It seems like the helper is used for users of Gatsby.

I'm thinking now that my changes to the Babel documentation article should not be made until we also upgrade the above helper to use our preset (e.g. the helper adds babel-plugin-macros which is not used in our internal preset). Let me know if I should revert my changes to the article.

There are a few other guides that explain a custom babel config. Should I update them as well (test-css-in-js and unit-testing)?

@DSchau

This PR adds `babel-preset-gatsby`, a new package that exposes our babel config as a handy preset that we can re-use in all our internal packages as well as in public packages. I've added a new option, `targets`, to overwrite the preset-env targets. You can see the changes in the updated Babel documentation. In gatsbyjs#6170, @DSchau mentioned that we want to replace [`babel-loader-helpers`][] with this preset as well (eventually). I'm not really sure what this helper is doing right now so I decided to not touch it. It seems like the helper is used for users of Gatsby. I'm thinking now that my changes to the Babel documentation article should not be made until we also upgrade the above helper to use our preset (e.g. the helper adds `babel-plugin-macros` which is not used in our internal preset). Let me know if I should revert my changes to the article. There are a few other guides that explain a custom babel config. Should I update them as well (test-css-in-js and unit-testing)? [`babel-loader-helpers`]: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/utils/babel-loader-helpers.js

philipp-spiess · 2018-10-02T21:42:24Z

packages/babel-preset-gatsby/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "babel-preset-gatsby",
+  "version": "2.5.0",


Not really sure what to use here. I copied from babel-plugin-remove-graphql-queries. Maybe we want to add a changelog as well?

Nope! Don't add a changelog, it'll get autogenerated by Lerna I believe.

cc @pieh sanity check me on this one :)

let's start with 1.0.0 (or lower heh) - all our packages have independent versions

DSchau

OK awesome! First of all; thanks so much!

I left a number of comments that I hope should clarify what we're looking for here, and help get this ship shape.

In general, I think there were two different approaches here:

There's a gatsby preset for gatsby packages (still helpful!)
There's a gatsby preset for gatsby sites, and this is where I was hoping we'd go!

It's probably my fault for not clarifying more in that issue, but I think this is still a great PR we can tweak to get merged. Note: that I do think there's value in adding both here, I'm just not sure how to best do it yet. babel-preset-gatsby (for sites) and babel-preset-gatsby-package (for packages?)

.babelrc.js

DSchau · 2018-10-02T21:45:13Z

packages/babel-plugin-remove-graphql-queries/.babelrc

@@ -1,5 +1,5 @@
 {
  "presets": [
-    ["../../.babel-preset.js"]
+    ["gatsby"]


OK so I thought we were on the same page here, but this seems weird. I wasn't thinking we'd use the gatsby preset for our own packages, but rather we'd expose this so that other gatsby sites could use this in e.g. jest tests or as a base that could then be extended.

Right... This makes a lot more sense now. 🤕

💯% my fault in the issue. I can totally see how it could be interpreted both ways!

Should we still use the same preset for our internal packages? I find it confusing that we have two different presets apparently 🙂

What about babel-preset-gatsby (for sites using gatsby) and babel-preset-gatsby-package (for packages/utilities for gatsby)

Also open to opinions here 🤷‍♂️

I was more thinking about unifying those presets - Not sure if that's possible though. 🙂 Before we start adding an option { package: true } it's probably better to separate those.

Our packages seem to use:

@babel/preset-env

@babel/preset-react

@babel/preset-flow

@babel/plugin-proposal-class-properties

@babel/plugin-proposal-optional-chaining

@babel/plugin-transform-runtime

For Jest config of sites we seem to suggest:

const babelOptions = { presets: ["@babel/react", "@babel/env"], plugins: [ "@babel/plugin-proposal-optional-chaining", "@babel/plugin-proposal-class-properties", ], }

Which can probably be the same as the one for packages without the browser stuff.

For sites (the thing we generate with babel-loader-helpers) the thing seems to be a lot more complex, involving different stages and something referred to as required/fallback plugins). In the Babel documentation article we mention this config:

{ 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, }, ], ], }

Now I understand why you were talking about updating the helper in a follow-up 🙈

I think it makes sense to remove the fallbackPlugins/fallbackPresets from the babel-loader in favor of the babel-preset-gatsby which should be the only fallback for sites. This means that we need:

@babel/preset-env

@babel/preset-react

@babel/plugin-proposal-class-properties

babel-plugin-macros

@babel/plugin-syntax-dynamic-import

@babel/plugin-transform-runtime

We probably don't want to add babel-plugin-macros and @babel/plugin-syntax-dynamic-import for our packages and also don't want to add @babel/preset-flow and @babel/plugin-proposal-optional-chaining to our sites. So I guess we should still separate for now or do you have an idea how we can unify this?

packages/babel-preset-gatsby/README.md

packages/babel-preset-gatsby/package.json

DSchau · 2018-10-02T21:46:01Z

packages/babel-preset-gatsby/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "babel-preset-gatsby",
+  "version": "2.5.0",


Should be 1.0.0?

packages/babel-preset-gatsby/package.json

packages/babel-preset-gatsby/src/__tests__/index.js

packages/babel-preset-gatsby/README.md

KyleAMathews · 2018-10-02T22:34:59Z

@philipp-spiess this is great! BTW, will it allow for implementing #2114?

philipp-spiess · 2018-10-02T22:48:45Z

@KyleAMathews I don't think this PR changes anything in that regard. We'd still need a flag/env-var to turn on "modern"-mode. I'm not finding a lot of resources how such a webpack setup could look like so it's hard to tell.

shannonbux · 2018-10-04T21:56:39Z

docs/docs/babel.md

@@ -22,48 +22,26 @@ 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.
+to add custom Babel presets or plugins, you can import our preset and overwrite the target option.


does "our preset" mean babel-preset-gatsby? If so, it would be clearer to just say that instead of "our preset."

shannonbux · 2018-10-04T21:57:28Z

docs/docs/babel.md

@@ -22,48 +22,26 @@ 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


Is the default setup the babel-preset-gatsby-package thing? If so, would it make sense to link to it here and name it?

babel-preset-gatsby would/will be the one used by 99% of users!

I have yet to finish the implementation as well as the docs. Will definitely incorporate this, thanks 🙂

My plan is to have it ready for a next review cycle until the end of the week.

@philipp-spiess whenever you can get to is great! I think this is an impactful change, particularly in re: to being easier to set up testing!

shannonbux

I approve the docs changes as long as this is technically good to go, which others will have to decide 👍

philipp-spiess

Alright @DSchau this should be good for a second review pass 🙂 Thanks for your patience.

packages/babel-preset-gatsby/package.json

package.json

packages/babel-preset-gatsby/src/index.js

philipp-spiess · 2018-10-07T11:47:27Z

packages/gatsby/src/utils/babel-loader-helpers.js

-    }
-  } else {
-    targets = {
-      browsers: pluginBabelConfig.browserslist,


I'm a bit confused here about pluginBabelConfig.browserslist. Where are we reading pluginBabelConfig from? There seems to be a ./.cache/babelState.json file but I don't think I can access this from our new npm package.

See #8724 (comment)

philipp-spiess · 2018-10-07T11:48:17Z

packages/babel-preset-gatsby/src/index.js

+      }
+    } else {
+      targets = {
+        browsers: [`>0.25%`, `not dead`],


I've hardcoded this now. We need to figure out how we can retrieve that from ./.cache/babelState.json (see my comment on the babel-loader-helpers.js file).

Still looking into that. Seems like the file is generated here:

gatsby/packages/gatsby/src/internal-plugins/load-babel-config/gatsby-node.js

Lines 8 to 28 in f7d3231

exports.onPreBootstrap = async ({ store }) => {

const { directory, browserslist } = store.getState().program

const directoryPath = withBasePath(directory)

await apiRunnerNode(`onCreateBabelConfig`, {

stage: `develop`,

})

await apiRunnerNode(`onCreateBabelConfig`, {

stage: `develop-html`,

})

await apiRunnerNode(`onCreateBabelConfig`, {

stage: `build-javascript`,

})

await apiRunnerNode(`onCreateBabelConfig`, {

stage: `build-html`,

})

const babelrcState = store.getState().babelrc

babelrcState.browserslist = browserslist

const babelState = JSON.stringify(babelrcState.stages, null, 4)

await fs.writeFile(directoryPath(`.cache/babelState.json`), babelState)

}

I understand this as being placed inside the .cache directory inside the site root, correct?

In this case I can probably just use the same pattern to access this file like we currently do:

gatsby/packages/gatsby/src/utils/babel-loader-helpers.js

Lines 4 to 13 in f7d3231

const loadCachedConfig = () => {

let pluginBabelConfig = { test: { plugins: [], presets: [] } }

if (process.env.NODE_ENV !== `test`) {

pluginBabelConfig = require(path.join(

process.cwd(),

`./.cache/babelState.json`

))

}

return pluginBabelConfig

}

Which is what I'm doing right now.

packages/gatsby/package.json

# Conflicts: # yarn.lock

packages/babel-preset-gatsby-package/src/__tests__/index.js

DSchau · 2018-10-10T20:46:26Z

@philipp-spiess circling back to this; sorry for the delay!

This is looking great. Would you mind merging upstream/master into your fork? We made some fixes to the Windows pipeline, so the failures would be a little clearer with that change.

In looking through the Azure pipeline stuff, it looks like some tests are failing with the path separator character. Maybe instead of

expect.stringContaining(`@babel/preset-env`);

we use

const path = require(`path`) // if it's not already required

expect.stringContaining([`@babel`, `preset-env`].join(path.sep))

that seems to be a decent solution but open to any and all solutions!

tricoder42 · 2018-10-13T11:47:54Z

@DSchau You can use path.join directly:

const path = require(`path`) // if it's not already required

- expect.stringContaining([`@babel`, `preset-env`].join(path.sep))
+ expect.stringContaining(path.join(`@babel`, `preset-env`))

Not sure if there's a better way. Cross-compatibility is hard.

silvenon

Thanks for working on this! ❤️ Btw, you have excellent documentation skills. 👌

Adding a .babelrc file reverts all Babel config changes made by Gatsby plugins, right? Let's say that I want to add Flow, if I have a .babelrc file, gatsby-plugin-flow will no longer work and I should add @babel/preset-flow to .babelrc file myself, right? If yes, maybe it would be useful to document that as well.

docs/docs/babel.md

docs/docs/unit-testing.md

silvenon · 2018-10-13T15:31:13Z

packages/babel-preset-gatsby/README.md

+
+### `targets`
+
+`{ [string]: number | string }`, defaults to `{ "browsers": ["last 4 versions", "safari >= 7", "ie >= 9"] }` in production and `{ "browsers": ["last 2 versions", "not ie <= 11", "not android 4.4.3"] }` in development when targeting the browser and `{ "node": 6 }` in production and `{ "node": "current" }` in development when targeting Node.js.


Is it possible for users to configure this by add a .browserslistrc file? That way PostCSS can pick it up as well, which will result in a clean support table for the project.

If yes, it would be great to add this to the docs as well.

EDIT: I found out that Gatsby supports Browserslist, maybe that's where that pluginBabelConfig.browserslist comes from that you were wondering about.

Riiight that's documented here: https://www.gatsbyjs.org/docs/browser-support/#specify-what-browsers-your-project-supports-using-browserslist

In this case I don't think it's useful to mention this as a use case for the custom babel config like we do right now and add the targets option to babel-preset-gatsby at all.

I'm trying to think of another use case for customizing the Babel setup but it kinda feels plugins are already doing most of the "common" stuff. Maybe we can show how to add a hypothetical babel-transform-awesome-feature 🙈 ?

Actually I think it's out of scope for this PR, you've done so much already and this uncertainty isn't related to your PR. It's best to clarify this stuff in another PR.

DSchau · 2018-10-13T16:29:47Z

@tricoder42 that seems like a better solution, thank you for the suggestion!

philipp-spiess · 2018-10-14T13:36:34Z

Adding a .babelrc file reverts all Babel config changes made by Gatsby plugins, right? Let's say that I want to add Flow, if I have a .babelrc file, gatsby-plugin-flow will no longer work and I should add @babel/preset-flow to .babelrc file myself, right? If yes, maybe it would be useful to document that as well.

@silvenon I think this still works. We're always using a Gatsby controlled Babel config which always added a couple of "fallback" transforms if no .babelrc was found. The change I'm is only changing these "fallback" transforms to be a single preset instead.

Custom plugins can still add additional babel presets like they do right now: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-flow/src/gatsby-node.js

silvenon · 2018-10-14T13:43:17Z

Thanks, I did a little testing in the meantime and it turns out that a custom Babel configuration is a starting point for all modifications by Gatsby plugins, which is a relief. I will make this clear in a documentation PR later on.

philipp-spiess · 2018-10-14T13:43:20Z

Since this is getting a bit confusing (at least for me), here are the two open questions:

The rest should be resolved by now. 🙂

DSchau

Gonna check this out locally, but I think this is good to go and seriously a huge help for a lot of people, so thanks so much!

DSchau · 2018-10-23T18:38:04Z

docs/docs/babel.md

  ],
 }
 ```
+
+For more advanced configurations, you can also copy the defaults from [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby) and customize them to suite your needs.


Suggested change

For more advanced configurations, you can also copy the defaults from [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby) and customize them to suite your needs.

For more advanced configurations, you can also copy the defaults from [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby) and customize them to suit your needs.

But not important enough to prevent merging :) Working through this now!

DSchau · 2018-10-23T18:40:12Z

docs/docs/unit-testing.md

@@ -22,7 +22,7 @@ First you need to install Jest and some more required packages. You need to
 install Babel 7 as it's required by Jest.

 ```sh
-npm install --save-dev jest babel-jest react-test-renderer identity-obj-proxy 'babel-core@^7.0.0-0' @babel/core @babel/preset-env @babel/preset-react @babel/plugin-proposal-class-properties @babel/plugin-proposal-optional-chaining
+npm install --save-dev jest babel-jest react-test-renderer identity-obj-proxy 'babel-core@^7.0.0-0' @babel/core babel-preset-gatsby


This is so much better 💯

DSchau · 2018-10-23T18:41:48Z

packages/babel-preset-gatsby-package/src/__tests__/index.js

+
+  expect(presets).toEqual([
+    [
+      expect.stringContaining(path.join(`@babel`, `preset-env`)),


Love these tests, a lot. Thanks for adding!

DSchau · 2018-10-23T18:42:40Z

packages/babel-preset-gatsby-package/src/__tests__/index.js

+    ],
+    expect.stringContaining(path.join(`@babel`, `preset-flow`)),
+  ])
+  expect(plugins).toEqual([


@pieh unrelated, but I think these are a little more useful/readable than snapshots in most cases, so I think this is something we could adopt going forward.

gatsbot · 2018-10-23T18:55:04Z

Holy buckets, @philipp-spiess — we just merged your PR to Gatsby! 💪💜

Gatsby is built by awesome people like you. Let us say “thanks” in two ways:

We’d like to send you some Gatsby swag. As a token of our appreciation, you can go to the Gatsby Swag Store and log in with your GitHub account to get a coupon code good for one free piece of swag. (Currently we’ve got a couple t-shirts available, plus some socks that are really razzing our berries right now.)
We just invited you to join the Gatsby organization on GitHub. This will add you to our team of maintainers. Accept the invite by visiting https://github.com/orgs/gatsbyjs/invitation. By joining the team, you’ll be able to label issues, review pull requests, and merge approved pull requests.

If there’s anything we can do to help, please don’t hesitate to reach out to us: tweet at @gatsbyjs and we’ll come a-runnin’.

Thanks again!

DSchau · 2018-10-23T18:55:55Z

@philipp-spiess thanks again for this PR, like I mentioned, I think it's hugely impactful and it tends to make sense to encapsulate this internal tooling into packages! Sorry for the delay in getting it merged, but glad we finally did :) Releasing a bunch of packages now 😅

This reverts commit 69faca0.

…rst (#9322) * Revert "Add babel-preset-gatsby (#8724)" This reverts commit 69faca0. * chore: add these packages _first_ then use them in a future PR

@DSchau

Part of gatsbyjs#6170 This PR adds `babel-preset-gatsby`, a new package that exposes our babel config as a handy preset that we can re-use in all our internal packages as well as in public packages. I've added a new option, `targets`, to overwrite the preset-env targets. You can see the changes in the updated Babel documentation. In gatsbyjs#6170, @DSchau mentioned that we want to replace [`babel-loader-helpers`][] with this preset as well (eventually). I'm not really sure what this helper is doing right now so I decided to not touch it. It seems like the helper is used for users of Gatsby. I'm thinking now that my changes to the Babel documentation article should not be made until we also upgrade the above helper to use our preset (e.g. the helper adds `babel-plugin-macros` which is not used in our internal preset). Let me know if I should revert my changes to the article. There are a few other guides that explain a custom babel config. Should I update them as well (test-css-in-js and unit-testing)? [`babel-loader-helpers`]: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/utils/babel-loader-helpers.js

…rst (gatsbyjs#9322) * Revert "Add babel-preset-gatsby (gatsbyjs#8724)" This reverts commit 69faca0. * chore: add these packages _first_ then use them in a future PR

@DSchau

Part of gatsbyjs#6170 This PR adds `babel-preset-gatsby`, a new package that exposes our babel config as a handy preset that we can re-use in all our internal packages as well as in public packages. I've added a new option, `targets`, to overwrite the preset-env targets. You can see the changes in the updated Babel documentation. In gatsbyjs#6170, @DSchau mentioned that we want to replace [`babel-loader-helpers`][] with this preset as well (eventually). I'm not really sure what this helper is doing right now so I decided to not touch it. It seems like the helper is used for users of Gatsby. I'm thinking now that my changes to the Babel documentation article should not be made until we also upgrade the above helper to use our preset (e.g. the helper adds `babel-plugin-macros` which is not used in our internal preset). Let me know if I should revert my changes to the article. There are a few other guides that explain a custom babel config. Should I update them as well (test-css-in-js and unit-testing)? [`babel-loader-helpers`]: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/utils/babel-loader-helpers.js

…rst (gatsbyjs#9322) * Revert "Add babel-preset-gatsby (gatsbyjs#8724)" This reverts commit 69faca0. * chore: add these packages _first_ then use them in a future PR

philipp-spiess requested a review from a team as a code owner October 2, 2018 21:38

philipp-spiess requested a review from a team October 2, 2018 21:38

philipp-spiess mentioned this pull request Oct 2, 2018

Expose Babel config for Gatsby #6170

Closed

philipp-spiess commented Oct 2, 2018

View reviewed changes

DSchau suggested changes Oct 2, 2018

View reviewed changes

DSchau reviewed Oct 2, 2018

View reviewed changes

packages/babel-preset-gatsby/README.md Show resolved Hide resolved

philipp-spiess added 3 commits October 3, 2018 00:18

Use full name for babel-preset

e8abfe7

Change version

07177db

We need all dependencies, otherwise the preset won’t work

9f07c45

philipp-spiess added 2 commits October 3, 2018 01:02

Use babel-preset-gatsby-package for packages

4221f26

WIP Add proper config to babel-preset-gatsby

bafdb97

shannonbux reviewed Oct 4, 2018

View reviewed changes

shannonbux approved these changes Oct 5, 2018

View reviewed changes

philipp-spiess added 6 commits October 7, 2018 13:36

Remove targets option from babel-preset-gatsby

83ea3a2

Remove integration tests

4fd36e5

Pull out babel-preset-gatsby config from babel-loader-helpers

ca7eb79

Update docs

ea6011d

Update yarn lockfile

23ca219

Fix tests

d7c5867

philipp-spiess commented Oct 7, 2018

View reviewed changes

philipp-spiess added 2 commits October 8, 2018 19:41

Merge remote-tracking branch 'origin/master' into babel-preset-gatsby

eaca302

# Conflicts: # yarn.lock

Fix yarn.lock

637529a

philipp-spiess force-pushed the babel-preset-gatsby branch from 00be903 to 637529a Compare October 8, 2018 17:55

philipp-spiess commented Oct 8, 2018

View reviewed changes

packages/babel-preset-gatsby-package/src/__tests__/index.js Outdated Show resolved Hide resolved

silvenon reviewed Oct 13, 2018

View reviewed changes

philipp-spiess added 8 commits October 14, 2018 14:39

Merge remote-tracking branch 'origin/master' into babel-preset-gatsby

6f9841e

Update documentation

3ba98d8

Update gatsby-transfomer-pdf babel config

2d5df5a

Make tests work on Windows

37c5340

Check in changed lockfile

477ca42

Add compilation step to bable-preset-gatsby

66dfd2a

Prettify

e0c07b4

Read browserlist from babelState.json

1a10757

DSchau approved these changes Oct 23, 2018

View reviewed changes

minor language tweak

8c00f75

DSchau merged commit 69faca0 into gatsbyjs:master Oct 23, 2018

DSchau added a commit to DSchau/gatsby that referenced this pull request Oct 23, 2018

Revert "Add babel-preset-gatsby (gatsbyjs#8724)"

796c62d

This reverts commit 69faca0.

philipp-spiess deleted the babel-preset-gatsby branch October 23, 2018 19:53

DSchau mentioned this pull request Oct 23, 2018

chore: implement babel-preset-gatsby into packages that need it #9323

Merged

alexandernanberg mentioned this pull request Oct 24, 2018

Expose default babel config #7589

Closed

		@@ -22,48 +22,26 @@ 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

	exports.onPreBootstrap = async ({ store }) => {
	const { directory, browserslist } = store.getState().program
	const directoryPath = withBasePath(directory)

	await apiRunnerNode(`onCreateBabelConfig`, {
	stage: `develop`,
	})
	await apiRunnerNode(`onCreateBabelConfig`, {
	stage: `develop-html`,
	})
	await apiRunnerNode(`onCreateBabelConfig`, {
	stage: `build-javascript`,
	})
	await apiRunnerNode(`onCreateBabelConfig`, {
	stage: `build-html`,
	})
	const babelrcState = store.getState().babelrc
	babelrcState.browserslist = browserslist
	const babelState = JSON.stringify(babelrcState.stages, null, 4)
	await fs.writeFile(directoryPath(`.cache/babelState.json`), babelState)
	}

	const loadCachedConfig = () => {
	let pluginBabelConfig = { test: { plugins: [], presets: [] } }
	if (process.env.NODE_ENV !== `test`) {
	pluginBabelConfig = require(path.join(
	process.cwd(),
	`./.cache/babelState.json`
	))
	}
	return pluginBabelConfig
	}


		### `targets`

		`{ [string]: number \| string }`, defaults to `{ "browsers": ["last 4 versions", "safari >= 7", "ie >= 9"] }` in production and `{ "browsers": ["last 2 versions", "not ie <= 11", "not android 4.4.3"] }` in development when targeting the browser and `{ "node": 6 }` in production and `{ "node": "current" }` in development when targeting Node.js.

	For more advanced configurations, you can also copy the defaults from [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby) and customize them to suite your needs.
	For more advanced configurations, you can also copy the defaults from [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby) and customize them to suit your needs.

Add babel-preset-gatsby #8724

Add babel-preset-gatsby #8724

Conversation

philipp-spiess commented Oct 2, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

DSchau left a comment • edited Loading

Choose a reason for hiding this comment

DSchau Oct 2, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

philipp-spiess Oct 2, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

KyleAMathews commented Oct 2, 2018

philipp-spiess commented Oct 2, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

shannonbux left a comment

Choose a reason for hiding this comment

philipp-spiess left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

DSchau commented Oct 10, 2018 • edited Loading

tricoder42 commented Oct 13, 2018

silvenon left a comment

Choose a reason for hiding this comment

silvenon Oct 13, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

DSchau commented Oct 13, 2018

philipp-spiess commented Oct 14, 2018

silvenon commented Oct 14, 2018

philipp-spiess commented Oct 14, 2018 • edited Loading

DSchau left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gatsbot bot commented Oct 23, 2018

DSchau commented Oct 23, 2018

philipp-spiess commented Oct 2, 2018 •

edited

Loading

DSchau left a comment •

edited

Loading

DSchau Oct 2, 2018 •

edited

Loading

philipp-spiess Oct 2, 2018 •

edited

Loading

DSchau commented Oct 10, 2018 •

edited

Loading

silvenon Oct 13, 2018 •

edited

Loading

philipp-spiess commented Oct 14, 2018 •

edited

Loading