84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
我正在开发一个 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 运行时才可以,否则它会破坏主应用程序。