Support Bun by adjusting how @babel/plugin-transform-react-jsx is i…

…mported. (#8007) * Support bun/other tooling that respects `__esModule` * Add changeset file
withastro · Aug 9, 2023 · 58b121d · 58b121d
1 parent e65b5b5
commit 58b121d
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 12 deletions.
diff --git a/.changeset/quick-actors-sing.md b/.changeset/quick-actors-sing.md
@@ -0,0 +1,6 @@
+---
+'@astrojs/preact': patch
+'astro': patch
+---
+
+Support Bun by adjusting how `@babel/plugin-transform-react-jsx` is imported.
diff --git a/packages/astro/src/jsx/renderer.ts b/packages/astro/src/jsx/renderer.ts
@@ -3,10 +3,9 @@ const renderer = {
  serverEntrypoint: 'astro/jsx/server.js',
  jsxImportSource: 'astro',
  jsxTransformOptions: async () => {
- const {
- default: { default: jsx },
- // @ts-expect-error
- } = await import('@babel/plugin-transform-react-jsx');
+ // @ts-expect-error types not found
+ const plugin = await import('@babel/plugin-transform-react-jsx');
+ const jsx = plugin.default?.default ?? plugin.default;
  const { default: astroJSX } = await import('./babel.js');
  return {
  plugins: [

diff --git a/packages/integrations/preact/src/index.ts b/packages/integrations/preact/src/index.ts
@@ -7,10 +7,9 @@ function getRenderer(development: boolean): AstroRenderer {
  serverEntrypoint: '@astrojs/preact/server.js',
  jsxImportSource: 'preact',
  jsxTransformOptions: async () => {
- const {
- default: { default: jsx },
- // @ts-expect-error types not found
- } = await import('@babel/plugin-transform-react-jsx');
+ // @ts-expect-error types not found
+ const plugin = await import('@babel/plugin-transform-react-jsx');
+ const jsx = plugin.default?.default ?? plugin.default;
  return {
  plugins: [jsx({}, { runtime: 'automatic', importSource: 'preact' })],
  };
@@ -25,10 +24,9 @@ function getCompatRenderer(development: boolean): AstroRenderer {
  serverEntrypoint: '@astrojs/preact/server.js',
  jsxImportSource: 'react',
  jsxTransformOptions: async () => {
- const {
- default: { default: jsx },
- // @ts-expect-error types not found
- } = await import('@babel/plugin-transform-react-jsx');
+ // @ts-expect-error types not found
+ const plugin = await import('@babel/plugin-transform-react-jsx');
+ const jsx = plugin.default?.default ?? plugin.default;
  return {
  plugins: [
  jsx({}, { runtime: 'automatic', importSource: 'preact/compat' }),