Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Merged
merged 1 commit into from
Jul 5, 2024
Merged

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

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions dev-packages/rollup-utils/npmHelpers.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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));
Expand Down Expand Up @@ -143,7 +143,7 @@ export function makeNPMConfigVariants(baseConfig, options = {}) {
output: {
format: 'esm',
dir: path.join(baseConfig.output.dir, 'esm'),
plugins: [makePackageNodeEsm(), makeReactEsmJsxRuntimePlugin()],
plugins: [makePackageNodeEsm()],
},
});
}
Expand Down
15 changes: 0 additions & 15 deletions dev-packages/rollup-utils/plugins/make-esm-plugin.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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
Expand Down Expand Up @@ -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"',
},
});
}
4 changes: 3 additions & 1 deletion packages/react/rollup.npm.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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'`)
},
}),
Expand Down
4 changes: 3 additions & 1 deletion packages/remix/rollup.npm.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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'`)
},
}),
Expand Down
Loading