Skip to content

Commit

Permalink
Extract Babel configuration to babel-preset-react-app (facebook#701)
Browse files Browse the repository at this point in the history
  • Loading branch information
fson authored and feiqitian committed Oct 25, 2016
1 parent d97d462 commit 5738078
Show file tree
Hide file tree
Showing 6 changed files with 99 additions and 65 deletions.
21 changes: 21 additions & 0 deletions packages/babel-preset-react-app/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# babel-preset-react-app

This package includes the Babel preset used by [Create React App](https://github.com/facebookincubator/create-react-app).

## Usage in Create React App Projects

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.**

## Usage Outside of Create React App

If you want to use this ESLint configuration in a project not built with Create React App, you can install it with following steps.

First, [install Babel](https://babeljs.io/docs/setup/).

Then create a file named `.babelrc` with following contents in the root folder of your project:

```js
{
"presets": ["react-app"]
}
```
52 changes: 52 additions & 0 deletions packages/babel-preset-react-app/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';

var path = require('path');

module.exports = {
presets: [
// Latest stable ECMAScript features
require.resolve('babel-preset-latest'),
// JSX, Flow
require.resolve('babel-preset-react')
],
plugins: [
// class { handleClick = () => { } }
require.resolve('babel-plugin-transform-class-properties'),
// { ...todo, completed: true }
require.resolve('babel-plugin-transform-object-rest-spread'),
// function* () { yield 42; yield 43; }
[require.resolve('babel-plugin-transform-regenerator'), {
// Async functions are converted to generators by babel-preset-latest
async: false
}],
// Polyfills the runtime needed for async/await and generators
[require.resolve('babel-plugin-transform-runtime'), {
helpers: false,
polyfill: false,
regenerator: true,
// Resolve the Babel runtime relative to the config.
moduleName: path.dirname(require.resolve('babel-runtime/package'))
}]
],
env: {
production: {
plugins: [
// Optimization: hoist JSX that never changes out of render()
// Disabled because of issues:
// * https://github.com/facebookincubator/create-react-app/issues/525
// * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/
// * https://github.com/babel/babel/issues/4516
// TODO: Enable again when these issues are resolved.
// require.resolve('babel-plugin-transform-react-constant-elements')
]
}
}
};
23 changes: 23 additions & 0 deletions packages/babel-preset-react-app/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{
"name": "babel-preset-react-app",
"version": "0.0.1",
"description": "Babel preset used by Create React App",
"repository": "facebookincubator/create-react-app",
"license": "BSD-3-Clause",
"bugs": {
"url": "https://github.com/facebookincubator/create-react-app/issues"
},
"files": [
"index.js"
],
"dependencies": {
"babel-plugin-transform-class-properties": "6.11.5",
"babel-plugin-transform-object-rest-spread": "6.8.0",
"babel-plugin-transform-react-constant-elements": "6.9.1",
"babel-plugin-transform-regenerator": "6.14.0",
"babel-plugin-transform-runtime": "6.15.0",
"babel-preset-latest": "6.14.0",
"babel-preset-react": "6.11.1",
"babel-runtime": "6.11.6"
}
}
26 changes: 1 addition & 25 deletions packages/react-scripts/config/babel.dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
*/
// @remove-on-eject-end

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

module.exports = {
Expand All @@ -23,29 +22,6 @@ module.exports = {
name: 'react-scripts'
}),
presets: [
// Latest stable ECMAScript features
require.resolve('babel-preset-latest'),
// JSX, Flow
require.resolve('babel-preset-react')
],
plugins: [
// class { handleClick = () => { } }
require.resolve('babel-plugin-transform-class-properties'),
// { ...todo, completed: true }
require.resolve('babel-plugin-transform-object-rest-spread'),
// function* () { yield 42; yield 43; }
[require.resolve('babel-plugin-transform-regenerator'), {
// Async functions are converted to generators by babel-preset-latest
async: false
}],
// Polyfills the runtime needed for async/await and generators
[require.resolve('babel-plugin-transform-runtime'), {
helpers: false,
polyfill: false,
regenerator: true,
// Resolve the Babel runtime relative to the config.
// You can safely remove this after ejecting:
moduleName: path.dirname(require.resolve('babel-runtime/package'))
}]
require.resolve('babel-preset-react-app')
]
};
33 changes: 1 addition & 32 deletions packages/react-scripts/config/babel.prod.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,41 +9,10 @@
*/
// @remove-on-eject-end

var path = require('path');

module.exports = {
// Don't try to find .babelrc because we want to force this configuration.
babelrc: false,
presets: [
// Latest stable ECMAScript features
require.resolve('babel-preset-latest'),
// JSX, Flow
require.resolve('babel-preset-react')
],
plugins: [
// class { handleClick = () => { } }
require.resolve('babel-plugin-transform-class-properties'),
// { ...todo, completed: true }
require.resolve('babel-plugin-transform-object-rest-spread'),
// function* () { yield 42; yield 43; }
[require.resolve('babel-plugin-transform-regenerator'), {
// Async functions are converted to generators by babel-preset-latest
async: false
}],
// Polyfills the runtime needed for async/await and generators
[require.resolve('babel-plugin-transform-runtime'), {
helpers: false,
polyfill: false,
regenerator: true,
// Resolve the Babel runtime relative to the config.
// You can safely remove this after ejecting:
moduleName: path.dirname(require.resolve('babel-runtime/package'))
}],
// Optimization: hoist JSX that never changes out of render()
// Disabled because of issues:
// * https://github.com/facebookincubator/create-react-app/issues/525
// * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/
// TODO: Enable again when these issues are resolved.
// require.resolve('babel-plugin-transform-react-constant-elements')
require.resolve('babel-preset-react-app')
]
};
9 changes: 1 addition & 8 deletions packages/react-scripts/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,14 +26,7 @@
"babel-eslint": "6.1.2",
"babel-jest": "15.0.0",
"babel-loader": "6.2.5",
"babel-plugin-transform-class-properties": "6.11.5",
"babel-plugin-transform-object-rest-spread": "6.8.0",
"babel-plugin-transform-react-constant-elements": "6.9.1",
"babel-plugin-transform-regenerator": "6.14.0",
"babel-plugin-transform-runtime": "6.15.0",
"babel-preset-latest": "6.14.0",
"babel-preset-react": "6.11.1",
"babel-runtime": "6.11.6",
"babel-preset-react-app": "0.0.1",
"case-sensitive-paths-webpack-plugin": "1.1.4",
"chalk": "1.1.3",
"connect-history-api-fallback": "1.3.0",
Expand Down

0 comments on commit 5738078

Please sign in to comment.