├── .babelrc ├── .eslintrc ├── .gitignore ├── LICENSE.md ├── README.md ├── gulpfile.babel.js ├── package.json └── packages ├── babel-helper-is-react-class ├── .npmignore ├── package.json └── src │ └── index.js ├── babel-plugin-transform-react-pure-class-to-function ├── .npmignore ├── package.json ├── src │ └── index.js └── test │ ├── fixtures │ ├── .babelrc │ ├── impure-instance-props │ │ ├── actual.js │ │ └── expected.js │ ├── impure-methods │ │ ├── actual.js │ │ └── expected.js │ ├── impure-ref │ │ ├── actual.js │ │ └── expected.js │ ├── impure-state │ │ ├── actual.js │ │ └── expected.js │ ├── impure-static-props │ │ ├── actual.js │ │ └── expected.js │ ├── pure-class-expression │ │ ├── actual.js │ │ └── expected.js │ ├── pure-no-props │ │ ├── actual.js │ │ └── expected.js │ ├── pure-props │ │ ├── actual.js │ │ └── expected.js │ └── pure-static-props │ │ ├── actual.js │ │ └── expected.js │ └── index.js └── babel-preset-react-optimize ├── .npmignore ├── package.json └── src └── index.js /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015"] 3 | } 4 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "preset": "airbnb" 4 | } 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.log 3 | packages/*/lib 4 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | COPYRIGHT (c) 2016 James Kyle 2 | 3 | MIT License 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining 6 | a copy of this software and associated documentation files (the 7 | "Software"), to deal in the Software without restriction, including 8 | without limitation the rights to use, copy, modify, merge, publish, 9 | distribute, sublicense, and/or sell copies of the Software, and to 10 | permit persons to whom the Software is furnished to do so, subject to 11 | the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be 14 | included in all copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 19 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 20 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 21 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 22 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Babel React Optimize 2 | 3 | A Babel preset and plugins for optimizing React code. 4 | 5 | ## Optimizations 6 | 7 | ### [`transform-react-constant-elements`](https://github.com/babel/babel/tree/master/packages/babel-plugin-transform-react-constant-elements) 8 | 9 | **Input:** 10 | 11 | ```js 12 | class MyComponent extends React.Component { 13 | render() { 14 | return ( 15 |
16 | Hello World 17 |
18 | ); 19 | } 20 | } 21 | ``` 22 | 23 | **Output:** 24 | 25 | ```js 26 | var _ref = Hello World; 27 | 28 | class MyComponent extends React.Component { 29 | render() { 30 | return ( 31 |
32 | {_ref} 33 |
34 | ); 35 | } 36 | } 37 | ``` 38 | 39 | ### [`transform-react-inline-elements`](https://github.com/babel/babel/tree/master/packages/babel-plugin-transform-react-inline-elements) 40 | 41 | **Input:** 42 | 43 | ```js 44 | class MyComponent extends React.Component { 45 | render() { 46 | return ( 47 |
48 | Hello World 49 |
50 | ); 51 | } 52 | } 53 | ``` 54 | 55 | **Output:** 56 | 57 | ```js 58 | class MyComponent extends React.Component { 59 | render() { 60 | return ( 61 | _jsx('div', { className: this.props.className }, void 0, 62 | _jsx('span', {}, void 0, 'Hello World') 63 | ) 64 | ); 65 | } 66 | } 67 | ``` 68 | 69 | > **Note:** You should use this with `babel-runtime` and `babel-transform-runtime` to avoid duplicating the helper code in every file. 70 | 71 | ### [`transform-react-remove-prop-types`](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types) 72 | 73 | **Input:** 74 | ```js 75 | class MyComponent extends React.Component { 76 | static propTypes = { 77 | className: React.PropTypes.string.isRequired 78 | }; 79 | 80 | render() { 81 | return ( 82 |
83 | Hello World 84 |
85 | ); 86 | } 87 | } 88 | ``` 89 | 90 | **Output:** 91 | 92 | ```js 93 | class MyComponent extends React.Component { 94 | render() { 95 | return ( 96 |
97 | Hello World 98 |
99 | ); 100 | } 101 | } 102 | ``` 103 | 104 | ### [`transform-react-pure-class-to-function`](https://github.com/thejameskyle/babel-react-optimize/tree/master/packages/babel-plugin-transform-react-pure-class-to-function) 105 | 106 | **Input:** 107 | 108 | ```js 109 | class MyComponent extends React.Component { 110 | static propTypes = { 111 | className: React.PropTypes.string.isRequired 112 | }; 113 | 114 | render() { 115 | return ( 116 |
117 | Hello World 118 |
119 | ); 120 | } 121 | } 122 | ``` 123 | 124 | **Output:** 125 | 126 | ```js 127 | function MyComponent(props) { 128 | return ( 129 |
130 | Hello World 131 |
132 | ); 133 | } 134 | 135 | MyComponent.propTypes = { 136 | className: React.PropTypes.string.isRequired 137 | }; 138 | ``` 139 | 140 | ## Install 141 | 142 | ```sh 143 | $ npm install --save-dev babel-preset-react-optimize 144 | ``` 145 | 146 | ## Usage 147 | 148 | `.babelrc` 149 | 150 | ```json 151 | { 152 | "presets": ["es2015", "react"], 153 | "env": { 154 | "production": { 155 | "presets": ["react-optimize"] 156 | } 157 | } 158 | } 159 | ``` 160 | 161 | ## Benchmarks 162 | 163 | We haven't yet much benchmark. 164 | But this [post](https://medium.com/doctolib-engineering/improve-react-performance-with-babel-16f1becfaa25) 165 | can give you an idea of what you can win in real life. 166 | Notice that the win depends a lot on how you are using the React API. 167 | -------------------------------------------------------------------------------- /gulpfile.babel.js: -------------------------------------------------------------------------------- 1 | const through = require('through2'); 2 | const chalk = require('chalk'); 3 | const newer = require('gulp-newer'); 4 | const babel = require('gulp-babel'); 5 | const gutil = require('gulp-util'); 6 | const gulp = require('gulp'); 7 | const path = require('path'); 8 | 9 | const scripts = './packages/*/src/**/*.js'; 10 | const dest = 'packages'; 11 | 12 | let srcEx, libFragment; 13 | 14 | if (path.win32 === path) { 15 | srcEx = /(packages\\[^\\]+)\\src\\/; 16 | libFragment = '$1\\lib\\'; 17 | } else { 18 | srcEx = new RegExp('(packages/[^/]+)/src/'); 19 | libFragment = '$1/lib/'; 20 | } 21 | 22 | export function build() { 23 | return gulp.src(scripts) 24 | .pipe(through.obj((file, enc, callback) => { 25 | file._path = file.path; 26 | file.path = file.path.replace(srcEx, libFragment); 27 | callback(null, file); 28 | })) 29 | .pipe(newer(dest)) 30 | .pipe(through.obj((file, enc, callback) => { 31 | gutil.log('Compiling', '"' + chalk.cyan(file._path) + '"...'); 32 | callback(null, file); 33 | })) 34 | .pipe(babel()) 35 | .pipe(gulp.dest(dest)); 36 | } 37 | 38 | export const watch = gulp.series(build, () => { 39 | gulp.watch(scripts, { debounceDelay: 200 }, build); 40 | }); 41 | 42 | export default build; 43 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "license": "MIT", 4 | "scripts": { 5 | "bootstrap": "lerna bootstrap -i", 6 | "publish": "git pull --rebase && rm -rf packages/*/lib && npm run build && npm test && lerna publish -i", 7 | "test": "eslint packages/*/test packages/*/src && mocha packages/*/test/index.js --compilers js:babel-register", 8 | "build": "gulp build", 9 | "watch": "gulp watch" 10 | }, 11 | "devDependencies": { 12 | "babel-eslint": "^6.0.2", 13 | "babel-preset-es2015": "^6.6.0", 14 | "babel-register": "^6.7.2", 15 | "chalk": "^1.1.3", 16 | "eslint": "^2.8.0", 17 | "gulp": "github:gulpjs/gulp#4.0", 18 | "gulp-babel": "^6.1.2", 19 | "gulp-newer": "^1.1.0", 20 | "gulp-util": "^3.0.7", 21 | "lerna": "^2.0.0-beta.3", 22 | "mocha": "^2.4.5", 23 | "through2": "^2.0.1" 24 | }, 25 | "dependencies": {} 26 | } 27 | -------------------------------------------------------------------------------- /packages/babel-helper-is-react-class/.npmignore: -------------------------------------------------------------------------------- 1 | src 2 | test 3 | node_modules 4 | -------------------------------------------------------------------------------- /packages/babel-helper-is-react-class/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "babel-helper-is-react-class", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "lib/index.js", 6 | "license": "MIT", 7 | "author": "James Kyle ", 8 | "homepage": "https://github.com/thejameskyle/babel-react-optimize/tree/master/packages/babel-helper-is-react-class", 9 | "repository": "https://github.com/thejameskyle/babel-react-optimize/tree/master/packages/babel-helper-is-react-class", 10 | "bugs": "https://github.com/thejameskyle/babel-react-optimize/issues", 11 | "keywords": [ 12 | "babel-helper", 13 | "react", 14 | "optimize" 15 | ], 16 | "dependencies": {}, 17 | "devDependencies": {} 18 | } 19 | -------------------------------------------------------------------------------- /packages/babel-helper-is-react-class/src/index.js: -------------------------------------------------------------------------------- 1 | module.exports = function(t) { 2 | return function isReactClass(node) { 3 | const superClass = node.superClass; 4 | return ( 5 | t.isMemberExpression(superClass) && 6 | t.isIdentifier(superClass.object, { name: 'React' }) && 7 | t.isIdentifier(superClass.property, { name: 'Component' }) 8 | ); 9 | }; 10 | } 11 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/.npmignore: -------------------------------------------------------------------------------- 1 | src 2 | test 3 | node_modules 4 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "babel-plugin-transform-react-pure-class-to-function", 3 | "version": "1.0.1", 4 | "description": "", 5 | "main": "lib/index.js", 6 | "license": "MIT", 7 | "author": "James Kyle ", 8 | "homepage": "https://github.com/thejameskyle/babel-react-optimize#user-content-transform-react-pure-class-to-function", 9 | "repository": "https://github.com/thejameskyle/babel-react-optimize/tree/master/packages/babel-plugin-transform-react-pure-class-to-function", 10 | "bugs": "https://github.com/thejameskyle/babel-react-optimize/issues", 11 | "keywords": [ 12 | "babel-helper", 13 | "react", 14 | "optimize" 15 | ], 16 | "dependencies": { 17 | "babel-helper-is-react-class": "^1.0.0" 18 | }, 19 | "devDependencies": { 20 | "babel-core": "^6.7.6", 21 | "babel-plugin-syntax-class-properties": "^6.5.0", 22 | "babel-plugin-syntax-jsx": "^6.5.0" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/src/index.js: -------------------------------------------------------------------------------- 1 | module.exports = function({ types: t }) { 2 | const isReactClass = require('babel-helper-is-react-class')(t); 3 | 4 | const bodyVisitor = { 5 | ClassMethod(path) { 6 | if (path.node.key.name === 'render') { 7 | this.renderMethod = path; 8 | } else { 9 | this.isPure = false; 10 | path.stop(); 11 | } 12 | }, 13 | 14 | ClassProperty(path) { 15 | const name = path.node.key.name; 16 | 17 | if (path.node.static && ( 18 | name === 'propTypes' || 19 | name === 'defaultProps' 20 | )) { 21 | this.properties.push(path); 22 | } else { 23 | this.isPure = false; 24 | } 25 | }, 26 | 27 | MemberExpression(path) { 28 | const { node } = path; 29 | 30 | // non-this member expressions dont matter 31 | if (!t.isThisExpression(node.object)) { 32 | return; 33 | } 34 | 35 | // Don't allow this. 36 | if (!t.isIdentifier(node.property, { name: 'props' })) { 37 | this.isPure = false; 38 | path.stop(); 39 | return; 40 | } 41 | 42 | // this.props.foo => props.foo 43 | this.thisProps.push(path); 44 | }, 45 | 46 | JSXIdentifier(path) { 47 | if (path.node.name === 'ref') { 48 | this.isPure = false; 49 | path.stop(); 50 | } 51 | } 52 | }; 53 | 54 | return { 55 | visitor: { 56 | Class(path) { 57 | if (!isReactClass(path.node)) { 58 | // yo, fuck this class then. 59 | return; 60 | } 61 | 62 | const state = { 63 | renderMethod: null, 64 | properties: [], 65 | thisProps: [], 66 | isPure: true 67 | }; 68 | 69 | // get the render method and make sure it doesn't have any other methods 70 | path.traverse(bodyVisitor, state); 71 | 72 | if (!state.isPure || !state.renderMethod) { 73 | // fuck this class too. 74 | return; 75 | } 76 | 77 | const id = t.identifier(path.node.id.name); 78 | 79 | let replacement = []; 80 | 81 | state.thisProps.forEach(function(thisProp) { 82 | thisProp.replaceWith(t.identifier('props')); 83 | }); 84 | 85 | replacement.push( 86 | t.functionDeclaration( 87 | id, 88 | [t.identifier('props')], 89 | state.renderMethod.node.body 90 | ) 91 | ); 92 | 93 | state.properties.forEach(prop => { 94 | replacement.push(t.expressionStatement( 95 | t.assignmentExpression('=', 96 | t.MemberExpression(id, prop.node.key), 97 | prop.node.value 98 | ) 99 | )); 100 | }); 101 | 102 | if (t.isExpression(path.node)) { 103 | replacement.push(t.returnStatement(id)); 104 | 105 | replacement = t.callExpression( 106 | t.functionExpression(null, [], 107 | t.blockStatement(replacement) 108 | ), 109 | [] 110 | ); 111 | } 112 | 113 | path.replaceWithMultiple( 114 | replacement 115 | ); 116 | } 117 | } 118 | }; 119 | } 120 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": ["syntax-jsx", "syntax-class-properties", "../../src/index.js"] 3 | } 4 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-instance-props/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | bar = 'bar'; 3 | 4 | render() { 5 | this.props.foo; 6 | return
; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-instance-props/expected.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | bar = 'bar'; 3 | 4 | render() { 5 | this.props.foo; 6 | return
; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-methods/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | componentDidMount() { 3 | console.log('I mounted'); 4 | } 5 | 6 | render() { 7 | this.props.foo; 8 | return
; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-methods/expected.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | componentDidMount() { 3 | console.log('I mounted'); 4 | } 5 | 6 | render() { 7 | this.props.foo; 8 | return
; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-ref/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | this.props.foo; 4 | return
; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-ref/expected.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | this.props.foo; 4 | return
; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-state/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | this.props.foo; 4 | return
; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-state/expected.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | this.props.foo; 4 | return
; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-static-props/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | static bar = 'bar'; 3 | 4 | render() { 5 | this.props.foo; 6 | return
; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/impure-static-props/expected.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | static bar = 'bar'; 3 | 4 | render() { 5 | this.props.foo; 6 | return
; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-class-expression/actual.js: -------------------------------------------------------------------------------- 1 | module.exports = class Foo extends React.Component { 2 | static propTypes = { 3 | foo: React.PropTypes.string.isRequired 4 | }; 5 | 6 | render() { 7 | this.props.foo; 8 | return
; 9 | } 10 | }; 11 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-class-expression/expected.js: -------------------------------------------------------------------------------- 1 | module.exports = function () { 2 | function Foo(props) { 3 | props.foo; 4 | return
; 5 | } 6 | 7 | Foo.propTypes = { 8 | foo: React.PropTypes.string.isRequired 9 | }; 10 | return Foo; 11 | }(); 12 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-no-props/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | this.props.foo; 4 | return
; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-no-props/expected.js: -------------------------------------------------------------------------------- 1 | function Foo(props) { 2 | props.foo; 3 | return
; 4 | } 5 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-props/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | render() { 3 | return
; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-props/expected.js: -------------------------------------------------------------------------------- 1 | function Foo(props) { 2 | return
; 3 | } 4 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-static-props/actual.js: -------------------------------------------------------------------------------- 1 | class Foo extends React.Component { 2 | static propTypes = { 3 | className: React.PropTypes.string 4 | }; 5 | 6 | static defaultProps = { 7 | className: 'foo' 8 | }; 9 | 10 | render() { 11 | return
; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/fixtures/pure-static-props/expected.js: -------------------------------------------------------------------------------- 1 | function Foo(props) { 2 | return
; 3 | } 4 | 5 | Foo.propTypes = { 6 | className: React.PropTypes.string 7 | }; 8 | Foo.defaultProps = { 9 | className: 'foo' 10 | }; 11 | -------------------------------------------------------------------------------- /packages/babel-plugin-transform-react-pure-class-to-function/test/index.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | const fs = require("fs"); 3 | const assert = require("assert"); 4 | const babel = require("babel-core"); 5 | const plugin = require("../src/index"); 6 | 7 | function trim(str) { 8 | return str.replace(/^\s+|\s+$/, ""); 9 | } 10 | 11 | describe("fixtures", () => { 12 | const fixturesDir = path.join(__dirname, "fixtures"); 13 | 14 | fs.readdirSync(fixturesDir).map((caseName) => { 15 | if (caseName === '.babelrc') return; 16 | 17 | it(caseName.split("-").join(" "), () => { 18 | const fixtureDir = path.join(fixturesDir, caseName); 19 | const actual = babel.transformFileSync( 20 | path.join(fixtureDir, "actual.js") 21 | ).code; 22 | const expected = fs.readFileSync(path.join(fixtureDir, "expected.js")).toString(); 23 | 24 | assert.equal(trim(actual), trim(expected)); 25 | }); 26 | }); 27 | }); 28 | -------------------------------------------------------------------------------- /packages/babel-preset-react-optimize/.npmignore: -------------------------------------------------------------------------------- 1 | src 2 | test 3 | node_modules 4 | -------------------------------------------------------------------------------- /packages/babel-preset-react-optimize/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "babel-preset-react-optimize", 3 | "version": "1.0.1", 4 | "description": "", 5 | "main": "lib/index.js", 6 | "license": "MIT", 7 | "author": "James Kyle ", 8 | "homepage": "https://github.com/thejameskyle/babel-react-optimize#readme", 9 | "repository": "https://github.com/thejameskyle/babel-react-optimize/tree/master/packages/babel-preset-react-optimize", 10 | "bugs": "https://github.com/thejameskyle/babel-react-optimize/issues", 11 | "keywords": [ 12 | "babel-plugin", 13 | "react", 14 | "optimize" 15 | ], 16 | "dependencies": { 17 | "babel-plugin-transform-react-constant-elements": "^6.5.0", 18 | "babel-plugin-transform-react-inline-elements": "^6.6.5", 19 | "babel-plugin-transform-react-remove-prop-types": "^0.2.5", 20 | "babel-plugin-transform-react-pure-class-to-function": "^1.0.1" 21 | }, 22 | "devDependencies": {} 23 | } 24 | -------------------------------------------------------------------------------- /packages/babel-preset-react-optimize/src/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: [ 3 | require('babel-plugin-transform-react-constant-elements'), 4 | require('babel-plugin-transform-react-inline-elements'), 5 | require('babel-plugin-transform-react-remove-prop-types')['default'], 6 | require('babel-plugin-transform-react-pure-class-to-function') 7 | ] 8 | }; 9 | --------------------------------------------------------------------------------