Astro v4 using docsearch algolia error

[leezhian]

Astro Info

Astro                    v4.0.7
Node                     v20.9.0
System                   macOS (arm64)
Package Manager          npm
Output                   static
Adapter                  none
Integrations             astro-expressive-code
                         @astrojs/mdx
                         @astrojs/sitemap
                         @astrojs/react
                         @astrojs/tailwind

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

pnpm install @docsearch/react@3，Then use it according to its official documentation. There is no problem with Astro v3, but there will be errors in v4 version.

terminal output: [vite] Named export 'DocSearch' not found. The requested module '@docsearch/react' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using:

import pkg from '@docsearch/react'; const {DocSearch} = pkg;

Stack trace:

What's the expected result?

Astro V4 can use docsearch algolia normally.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-fagchq?file=src%2Fpages%2Findex.astro

Participation

• [ ] I am willing to submit a pull request for this issue.

[bluwy]

It's a breaking change from Vite 5: https://vitejs.dev/guide/migration.html#ssr-externalized-modules-value-now-matches-production. @docsearch/algolia should fix this on their end so ESM is correctly used. See https://publint.dev/@docsearch/react@3.5.2 (second suggestion). Otherwise you should workaround it as shown in the error message.