New: Enable React automatic runtime transforms 💖 (#65)

crystal-ball · Oct 15, 2020 · 6214d46 · 6214d46
1 parent 4d23b07
commit 6214d46
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/__snapshots__/index.spec.js.snap b/src/__snapshots__/index.spec.js.snap
@@ -75,7 +75,7 @@ Object {
       "@babel/preset-react",
       Object {
         "development": true,
-        "useBuiltIns": true,
+        "runtime": "automatic",
       },
     ],
     "@babel/preset-typescript",
@@ -124,7 +124,7 @@ Object {
       "@babel/preset-react",
       Object {
         "development": false,
-        "useBuiltIns": true,
+        "runtime": "automatic",
       },
     ],
     "@babel/preset-typescript",
@@ -173,7 +173,7 @@ Object {
       "@babel/preset-react",
       Object {
         "development": false,
-        "useBuiltIns": true,
+        "runtime": "automatic",
       },
     ],
     "@babel/preset-typescript",

diff --git a/src/react.ts b/src/react.ts
@@ -73,9 +73,11 @@ export default function reactConfigs(env: Env): TransformOptions {
         },
       ],
 
-      // Includes plugins required to transform JSX. Development plugins add
-      // references to source and self on each component
-      ['@babel/preset-react', { development: env('development'), useBuiltIns: true }],
+      // Includes plugins required to transform JSX and opts in to the automatic
+      // runtime which auto imports the functions that JSX transpiles to.
+      // Development option toggles plugins that add references to source and
+      // self on each component
+      ['@babel/preset-react', { development: env('development'), runtime: 'automatic' }],
 
       // Enable TypeScript usage 🔐
       '@babel/preset-typescript',