fix(react): Revert back to jsxRuntime: 'classic' to prevent breaking react 17 (#12775)

Undoes some of the changes in
#12204 and
#12740 to fix
#12608.

Author: andreiborza

dev-packages/rollup-utils/npmHelpers.mjs

@@ -22,7 +22,7 @@ import {
   makeSetSDKSourcePlugin,
   makeSucrasePlugin,
 } from './plugins/index.mjs';
-import { makePackageNodeEsm, makeReactEsmJsxRuntimePlugin } from './plugins/make-esm-plugin.mjs';
+import { makePackageNodeEsm } from './plugins/make-esm-plugin.mjs';
 import { mergePlugins } from './utils.mjs';
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
@@ -143,7 +143,7 @@ export function makeNPMConfigVariants(baseConfig, options = {}) {
       output: {
         format: 'esm',
         dir: path.join(baseConfig.output.dir, 'esm'),
-        plugins: [makePackageNodeEsm(), makeReactEsmJsxRuntimePlugin()],
+        plugins: [makePackageNodeEsm()],
       },
     });
   }

dev-packages/rollup-utils/plugins/make-esm-plugin.mjs

@@ -1,5 +1,4 @@
 import fs from 'node:fs';
-import replacePlugin from '@rollup/plugin-replace';
 
 /**
  * Outputs a package.json file with {type: module} in the root of the output directory so that Node
@@ -30,17 +29,3 @@ export function makePackageNodeEsm() {
     },
   };
 }
-
-/**
- * Makes sure that whenever we add an `react/jsx-runtime` import, we add a `.js` to make the import esm compatible.
- */
-export function makeReactEsmJsxRuntimePlugin() {
-  return replacePlugin({
-    preventAssignment: false,
-    sourceMap: true,
-    values: {
-      "'react/jsx-runtime'": "'react/jsx-runtime.js'",
-      '"react/jsx-runtime"': '"react/jsx-runtime.js"',
-    },
-  });
-}

packages/react/rollup.npm.config.mjs

@@ -7,7 +7,9 @@ export default makeNPMConfigVariants(
       external: ['react', 'react/jsx-runtime'],
     },
     sucrase: {
-      jsxRuntime: 'automatic', // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+      // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+      // but this breaks react 17, so we keep it at `classic` for now
+      jsxRuntime: 'classic',
       production: true, // This is needed so that sucrase uses the production jsx runtime (ie `import { jsx } from 'react/jsx-runtime'` instead of `import { jsxDEV as _jsxDEV } from 'react/jsx-dev-runtime'`)
     },
   }),

packages/remix/rollup.npm.config.mjs

@@ -12,7 +12,9 @@ export default [
         },
       },
       sucrase: {
-        jsxRuntime: 'automatic', // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+        // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+        // but this breaks react 17, so we keep it at `classic` for now
+        jsxRuntime: 'classic',
         production: true, // This is needed so that sucrase uses the production jsx runtime (ie `import { jsx } from 'react/jsx-runtime'` instead of `import { jsxDEV as _jsxDEV } from 'react/jsx-dev-runtime'`)
       },
     }),