diff options
Diffstat (limited to 'packages/renderers/renderer-react')
-rw-r--r-- | packages/renderers/renderer-react/index.js | 5 | ||||
-rw-r--r-- | packages/renderers/renderer-react/jsx-runtime.js | 12 | ||||
-rw-r--r-- | packages/renderers/renderer-react/package.json | 3 |
3 files changed, 18 insertions, 2 deletions
diff --git a/packages/renderers/renderer-react/index.js b/packages/renderers/renderer-react/index.js index e73dd622a..a3cedcf07 100644 --- a/packages/renderers/renderer-react/index.js +++ b/packages/renderers/renderer-react/index.js @@ -8,7 +8,10 @@ export default { default: { default: jsx }, } = await import('@babel/plugin-transform-react-jsx'); return { - plugins: [jsx({}, { runtime: 'automatic', importSource: 'react' })], + plugins: [jsx({}, { + runtime: 'automatic', + importSource: '@astrojs/renderer-react' + })], }; }, viteConfig() { diff --git a/packages/renderers/renderer-react/jsx-runtime.js b/packages/renderers/renderer-react/jsx-runtime.js new file mode 100644 index 000000000..1df555fc0 --- /dev/null +++ b/packages/renderers/renderer-react/jsx-runtime.js @@ -0,0 +1,12 @@ +// This module is a simple wrapper around react/jsx-runtime so that +// it can run in Node ESM. 'react' doesn't declare this module as an export map +// So we have to use the .js. The .js is not added via the babel automatic JSX transform +// hence this module as a workaround. +import jsxr from 'react/jsx-runtime.js'; +const { jsx, jsxs, Fragment } = jsxr; + +export { + jsx, + jsxs, + Fragment +}; diff --git a/packages/renderers/renderer-react/package.json b/packages/renderers/renderer-react/package.json index c8e02ad2f..b462a120e 100644 --- a/packages/renderers/renderer-react/package.json +++ b/packages/renderers/renderer-react/package.json @@ -17,7 +17,8 @@ "./*": "./*", "./client.js": "./client.js", "./server.js": "./server.js", - "./package.json": "./package.json" + "./package.json": "./package.json", + "./jsx-runtime": "./jsx-runtime.js" }, "dependencies": { "@babel/plugin-transform-react-jsx": "^7.16.0", |