Skip to content

Commit 5b85a36

Browse files
fsongaearon
authored andcommitted
Extract Babel configuration to babel-preset-react-app (#701)
1 parent d3ecd6d commit 5b85a36

File tree

6 files changed

+99
-65
lines changed

6 files changed

+99
-65
lines changed
+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# babel-preset-react-app
2+
3+
This package includes the Babel preset used by [Create React App](https://github.com/facebookincubator/create-react-app).
4+
5+
## Usage in Create React App Projects
6+
7+
The easiest way to use this configuration is with [Create React App](https://github.com/facebookincubator/create-react-app), which includes it by default. **You don’t need to install it separately in Create React App projects.**
8+
9+
## Usage Outside of Create React App
10+
11+
If you want to use this ESLint configuration in a project not built with Create React App, you can install it with following steps.
12+
13+
First, [install Babel](https://babeljs.io/docs/setup/).
14+
15+
Then create a file named `.babelrc` with following contents in the root folder of your project:
16+
17+
```js
18+
{
19+
"presets": ["react-app"]
20+
}
21+
```
+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
/**
2+
* Copyright (c) 2015-present, Facebook, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the BSD-style license found in the
6+
* LICENSE file in the root directory of this source tree. An additional grant
7+
* of patent rights can be found in the PATENTS file in the same directory.
8+
*/
9+
'use strict';
10+
11+
var path = require('path');
12+
13+
module.exports = {
14+
presets: [
15+
// Latest stable ECMAScript features
16+
require.resolve('babel-preset-latest'),
17+
// JSX, Flow
18+
require.resolve('babel-preset-react')
19+
],
20+
plugins: [
21+
// class { handleClick = () => { } }
22+
require.resolve('babel-plugin-transform-class-properties'),
23+
// { ...todo, completed: true }
24+
require.resolve('babel-plugin-transform-object-rest-spread'),
25+
// function* () { yield 42; yield 43; }
26+
[require.resolve('babel-plugin-transform-regenerator'), {
27+
// Async functions are converted to generators by babel-preset-latest
28+
async: false
29+
}],
30+
// Polyfills the runtime needed for async/await and generators
31+
[require.resolve('babel-plugin-transform-runtime'), {
32+
helpers: false,
33+
polyfill: false,
34+
regenerator: true,
35+
// Resolve the Babel runtime relative to the config.
36+
moduleName: path.dirname(require.resolve('babel-runtime/package'))
37+
}]
38+
],
39+
env: {
40+
production: {
41+
plugins: [
42+
// Optimization: hoist JSX that never changes out of render()
43+
// Disabled because of issues:
44+
// * https://github.com/facebookincubator/create-react-app/issues/525
45+
// * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/
46+
// * https://github.com/babel/babel/issues/4516
47+
// TODO: Enable again when these issues are resolved.
48+
// require.resolve('babel-plugin-transform-react-constant-elements')
49+
]
50+
}
51+
}
52+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"name": "babel-preset-react-app",
3+
"version": "0.0.1",
4+
"description": "Babel preset used by Create React App",
5+
"repository": "facebookincubator/create-react-app",
6+
"license": "BSD-3-Clause",
7+
"bugs": {
8+
"url": "https://github.com/facebookincubator/create-react-app/issues"
9+
},
10+
"files": [
11+
"index.js"
12+
],
13+
"dependencies": {
14+
"babel-plugin-transform-class-properties": "6.11.5",
15+
"babel-plugin-transform-object-rest-spread": "6.8.0",
16+
"babel-plugin-transform-react-constant-elements": "6.9.1",
17+
"babel-plugin-transform-regenerator": "6.14.0",
18+
"babel-plugin-transform-runtime": "6.15.0",
19+
"babel-preset-latest": "6.14.0",
20+
"babel-preset-react": "6.11.1",
21+
"babel-runtime": "6.11.6"
22+
}
23+
}

packages/react-scripts/config/babel.dev.js

+1-25
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@
99
*/
1010
// @remove-on-eject-end
1111

12-
var path = require('path');
1312
var findCacheDir = require('find-cache-dir');
1413

1514
module.exports = {
@@ -23,29 +22,6 @@ module.exports = {
2322
name: 'react-scripts'
2423
}),
2524
presets: [
26-
// Latest stable ECMAScript features
27-
require.resolve('babel-preset-latest'),
28-
// JSX, Flow
29-
require.resolve('babel-preset-react')
30-
],
31-
plugins: [
32-
// class { handleClick = () => { } }
33-
require.resolve('babel-plugin-transform-class-properties'),
34-
// { ...todo, completed: true }
35-
require.resolve('babel-plugin-transform-object-rest-spread'),
36-
// function* () { yield 42; yield 43; }
37-
[require.resolve('babel-plugin-transform-regenerator'), {
38-
// Async functions are converted to generators by babel-preset-latest
39-
async: false
40-
}],
41-
// Polyfills the runtime needed for async/await and generators
42-
[require.resolve('babel-plugin-transform-runtime'), {
43-
helpers: false,
44-
polyfill: false,
45-
regenerator: true,
46-
// Resolve the Babel runtime relative to the config.
47-
// You can safely remove this after ejecting:
48-
moduleName: path.dirname(require.resolve('babel-runtime/package'))
49-
}]
25+
require.resolve('babel-preset-react-app')
5026
]
5127
};

packages/react-scripts/config/babel.prod.js

+1-32
Original file line numberDiff line numberDiff line change
@@ -9,41 +9,10 @@
99
*/
1010
// @remove-on-eject-end
1111

12-
var path = require('path');
13-
1412
module.exports = {
1513
// Don't try to find .babelrc because we want to force this configuration.
1614
babelrc: false,
1715
presets: [
18-
// Latest stable ECMAScript features
19-
require.resolve('babel-preset-latest'),
20-
// JSX, Flow
21-
require.resolve('babel-preset-react')
22-
],
23-
plugins: [
24-
// class { handleClick = () => { } }
25-
require.resolve('babel-plugin-transform-class-properties'),
26-
// { ...todo, completed: true }
27-
require.resolve('babel-plugin-transform-object-rest-spread'),
28-
// function* () { yield 42; yield 43; }
29-
[require.resolve('babel-plugin-transform-regenerator'), {
30-
// Async functions are converted to generators by babel-preset-latest
31-
async: false
32-
}],
33-
// Polyfills the runtime needed for async/await and generators
34-
[require.resolve('babel-plugin-transform-runtime'), {
35-
helpers: false,
36-
polyfill: false,
37-
regenerator: true,
38-
// Resolve the Babel runtime relative to the config.
39-
// You can safely remove this after ejecting:
40-
moduleName: path.dirname(require.resolve('babel-runtime/package'))
41-
}],
42-
// Optimization: hoist JSX that never changes out of render()
43-
// Disabled because of issues:
44-
// * https://github.com/facebookincubator/create-react-app/issues/525
45-
// * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/
46-
// TODO: Enable again when these issues are resolved.
47-
// require.resolve('babel-plugin-transform-react-constant-elements')
16+
require.resolve('babel-preset-react-app')
4817
]
4918
};

packages/react-scripts/package.json

+1-8
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,7 @@
2626
"babel-eslint": "6.1.2",
2727
"babel-jest": "15.0.0",
2828
"babel-loader": "6.2.5",
29-
"babel-plugin-transform-class-properties": "6.11.5",
30-
"babel-plugin-transform-object-rest-spread": "6.8.0",
31-
"babel-plugin-transform-react-constant-elements": "6.9.1",
32-
"babel-plugin-transform-regenerator": "6.14.0",
33-
"babel-plugin-transform-runtime": "6.15.0",
34-
"babel-preset-latest": "6.14.0",
35-
"babel-preset-react": "6.11.1",
36-
"babel-runtime": "6.11.6",
29+
"babel-preset-react-app": "0.0.1",
3730
"case-sensitive-paths-webpack-plugin": "1.1.4",
3831
"chalk": "1.1.3",
3932
"connect-history-api-fallback": "1.3.0",

0 commit comments

Comments
 (0)