我應該在我的庫包中包含節點模組嗎？

Question

我正在開發一個 React 元件庫。該庫被多個內部 NextJs 專案使用。

出於與 NextJs 相容性的原因，該程式庫需要在某個時候轉換為 CommonJs。

問題是我的庫的一些 npm 依賴項不處理 CommonJS。例如，swiper 就是這種情況。

所以我有兩個選擇：

• 我要么將 npm 依賴項宣告為peerDependency，然後由我的函式庫的每個使用者來正確地轉譯它們。這使得我的庫包變得更輕，但它在每個專案中創建了許多配置限制（例如，對於 NextJs 以及 Jest）。
• 或我將 npm 依賴項包含在我的套件中，這在我看來是一種反模式，但它允許我公開 CJS 和 MJS：我的庫的使用者幾乎沒有任何事情可做。

我還可以設想兩者的混合：我忽略管理 CommonJs 和 ES 模組的所有依賴項，並且只轉置那些必要的依賴項。

你覺得怎麼樣？

Answer 1

我們也有同樣的情況 - 我們有一個 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