我正在开发一个 React 组件库。该库被多个内部 NextJs 项目使用。
出于与 NextJs 兼容性的原因，该库需要在某个时候转换为 CommonJs。
问题是我的库的一些 npm 依赖项不处理 CommonJS。例如，swiper 就是这种情况。
所以我有两个选择：
我还可以设想两者的混合：我忽略管理 CommonJs 和 ES 模块的所有依赖项，并且只转置那些必要的依赖项。
你觉得怎么样？
我们也有同样的情况 - 我们有一个 Next.js 应用程序，它依赖于具有潜在 ESM 模块的核心库。不过，我建议不要捆绑您的依赖项。您的下游应用程序可能具有相同的依赖项，现在您最终将加载它们两次。而且您可能已经在其他第 3 方依赖项（具有 ESM 依赖项）中遇到了此问题。只需将它们添加到 next.config.js 中的 transpilePackages 列表中即可：https://nextjs.org/docs/app/api-reference/next-config-js/transpilePackages。我们还使用 next/jest ，它似乎也可以获取配置并且似乎可以工作。唯一需要注意的是，我发现我们必须转译 @babel/runtime 但只有在 jest 运行时才可以，否则它会破坏主应用程序。
next.config.js
transpilePackages
@babel/runtime
/** @type {import('next').NextConfig} */ const nextConfig = { transpilePackages: ['@acme/ui', 'lodash-es'], } module.exports = nextConfig
我们也有同样的情况 - 我们有一个 Next.js 应用程序，它依赖于具有潜在 ESM 模块的核心库。不过，我建议不要捆绑您的依赖项。您的下游应用程序可能具有相同的依赖项，现在您最终将加载它们两次。而且您可能已经在其他第 3 方依赖项（具有 ESM 依赖项）中遇到了此问题。只需将它们添加到
next.config.js中的transpilePackages列表中即可：https://nextjs.org/docs/app/api-reference/next-config-js/transpilePackages。我们还使用 next/jest ，它似乎也可以获取配置并且似乎可以工作。唯一需要注意的是，我发现我们必须转译@babel/runtime但只有在 jest 运行时才可以，否则它会破坏主应用程序。/** @type {import('next').NextConfig} */ const nextConfig = { transpilePackages: ['@acme/ui', 'lodash-es'], } module.exports = nextConfig