diff --git a/docs/pages/build.md b/docs/pages/build.md index f074b75d8..e3245b2ba 100644 --- a/docs/pages/build.md +++ b/docs/pages/build.md @@ -238,6 +238,10 @@ Example: ["module", { "esm": true, "sourceMaps": false }] ``` +##### `jsxRuntime` + +Explicitly set your [runtime](https://babeljs.io/docs/babel-preset-react#runtime). Defaults to `automatic`. + #### `typescript` Enable generating type definitions with `tsc` if your source code is written in [TypeScript](http://www.typescriptlang.org/). diff --git a/packages/react-native-builder-bob/babel-preset.js b/packages/react-native-builder-bob/babel-preset.js index de4e99a5a..44820fabc 100644 --- a/packages/react-native-builder-bob/babel-preset.js +++ b/packages/react-native-builder-bob/babel-preset.js @@ -6,6 +6,7 @@ const browserslist = require('browserslist'); * Babel preset for React Native Builder Bob * @param {'commonjs' | 'preserve'} options.modules - Whether to compile modules to CommonJS or preserve them * @param {Boolean} options.esm - Whether to output ES module compatible code, e.g. by adding extension to import/export statements + * @param {'automatic' | 'classic'} options.jsxRuntime - Which JSX runtime to use, defaults to 'automatic' */ module.exports = function (api, options, cwd) { const cjs = options.modules === 'commonjs'; @@ -37,7 +38,8 @@ module.exports = function (api, options, cwd) { [ require.resolve('@babel/preset-react'), { - runtime: 'automatic', + runtime: + options.jsxRuntime !== undefined ? options.jsxRuntime : 'automatic', }, ], require.resolve('@babel/preset-typescript'), diff --git a/packages/react-native-builder-bob/src/utils/compile.ts b/packages/react-native-builder-bob/src/utils/compile.ts index c0afdf8e5..d7249bdfb 100644 --- a/packages/react-native-builder-bob/src/utils/compile.ts +++ b/packages/react-native-builder-bob/src/utils/compile.ts @@ -13,6 +13,7 @@ type Options = Input & { copyFlow?: boolean; modules: 'commonjs' | 'preserve'; exclude: string; + jsxRuntime?: 'automatic' | 'classic'; }; const sourceExt = /\.([cm])?[jt]sx?$/; @@ -29,6 +30,7 @@ export default async function compile({ copyFlow, sourceMaps = true, report, + jsxRuntime = 'automatic', }: Options) { const files = glob.sync('**/*', { cwd: source, @@ -113,6 +115,7 @@ export default async function compile({ // If a file is explicitly marked as ESM, then preserve the syntax /\.m[jt]s$/.test(filepath) ? 'preserve' : modules, esm, + jsxRuntime, }, ], ],