babel-preset-react-app 5.0.4 → 6.1.0

package/README.md

@@ -32,19 +32,22 @@ Then create a file named `.babelrc` with following contents in the root folder o
 
 This preset uses the `useBuiltIns` option with [transform-object-rest-spread](http://babeljs.io/docs/plugins/transform-object-rest-spread/) and [transform-react-jsx](http://babeljs.io/docs/plugins/transform-react-jsx/), which assumes that `Object.assign` is available or polyfilled.
 
-## Usage with TypeScript
+## Usage with Flow
+
+Flow is enabled by default. Make sure you have a `.flowconfig` file at the root directory. You can also use the `flow` option on `.babelrc`:
+
+```
+{
+  "presets": [["react-app", { "flow": true, "typescript": false }]]
+}
+```
 
-To use this package with [`@babel/preset-typescript`](https://www.npmjs.com/package/@babel/preset-typescript), you need to disable `@babel/preset-flow` first.
+## Usage with TypeScript
 
-You can achieve this by doing:
+TypeScript is enabled by default. Make sure you have a `tsconfig.json` file at the root directory. You can also use the `typescript` option on `.babelrc`:
 
 ```
 {
-  "presets": [
-    ["react-app", {
-        "flow": false
-    }],
-    "@babel/typescript"
-  ]
+  "presets": [["react-app", { "flow": false, "typescript": true }]]
 }
 ```

package/create.js

@@ -30,6 +30,11 @@ module.exports = function(api, opts, env) {
   var isEnvTest = env === 'test';
 
   var isFlowEnabled = validateBoolOption('flow', opts.flow, true);
+  var isTypeScriptEnabled = validateBoolOption(
+    'typescript',
+    opts.typescript,
+    true
+  );
   var areHelpersEnabled = validateBoolOption('helpers', opts.helpers, true);
   var useAbsoluteRuntime = validateBoolOption(
     'absoluteRuntime',
@@ -97,6 +102,7 @@ module.exports = function(api, opts, env) {
           useBuiltIns: true,
         },
       ],
+      isTypeScriptEnabled && [require('@babel/preset-typescript').default],
     ].filter(Boolean),
     plugins: [
       // Strip flow types before any other transform, emulating the behavior
@@ -111,6 +117,11 @@ module.exports = function(api, opts, env) {
       // in practice some other transforms (such as object-rest-spread)
       // don't work without it: https://github.com/babel/babel/issues/7215
       require('@babel/plugin-transform-destructuring').default,
+      // Turn on legacy decorators for TypeScript files
+      isTypeScriptEnabled && [
+        require('@babel/plugin-proposal-decorators').default,
+        false,
+      ],
       // class { handleClick = () => { } }
       // Enable loose mode to use assignment instead of defineProperty
       // See discussion in https://github.com/facebook/create-react-app/issues/4263
@@ -160,5 +171,16 @@ module.exports = function(api, opts, env) {
         // Transform dynamic import to require
         require('babel-plugin-dynamic-import-node'),
     ].filter(Boolean),
+    overrides: [
+      isTypeScriptEnabled && {
+        test: /\.tsx?$/,
+        plugins: [
+          [
+            require('@babel/plugin-proposal-decorators').default,
+            { legacy: true },
+          ],
+        ],
+      },
+    ].filter(Boolean),
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "babel-preset-react-app",
-  "version": "5.0.4",
+  "version": "6.1.0",
   "description": "Babel preset used by Create React App",
   "repository": "facebook/create-react-app",
   "license": "MIT",
@@ -19,6 +19,7 @@
   "dependencies": {
     "@babel/core": "7.1.0",
     "@babel/plugin-proposal-class-properties": "7.1.0",
+    "@babel/plugin-proposal-decorators": "7.1.2",
     "@babel/plugin-proposal-object-rest-spread": "7.0.0",
     "@babel/plugin-syntax-dynamic-import": "7.0.0",
     "@babel/plugin-transform-classes": "7.1.0",
@@ -29,6 +30,7 @@
     "@babel/plugin-transform-runtime": "7.1.0",
     "@babel/preset-env": "7.1.0",
     "@babel/preset-react": "7.0.0",
+    "@babel/preset-typescript": "7.1.0",
     "@babel/runtime": "7.0.0",
     "babel-loader": "8.0.4",
     "babel-plugin-dynamic-import-node": "2.2.0",