Bunchee，JS/TS 包的捆绑器

我发现 t3-env 中使用 Bunchee 来捆绑他们的 core、nextjs、nuxt 包。

邦奇

Bunchee 是一个零配置捆绑器，可以轻松捆绑 JS/TS 库。它构建在 Rollup 和 SWC 之上，让您可以专注于编写代码并同时生成多个包（CommonJS 或 ESModule）。

它使用 package.json 中的标准导出配置作为唯一的事实来源，并使用入口文件约定

匹配您的导出并将它们构建成捆绑包。

快速开始

1. 在 TS 项目中安装 Bunchee

使用以下命令安装bunkee：

npm install - save-dev bunchee typescript

2.配置

您可以使用 Bunchee 使用以下命令自动配置 package.json：

# Use bunchee to prepare package.json configuration
npm exec bunchee - prepare

或者您可以手动配置package.json。以下配置是从文档中选取的示例。

{
 "files": ["dist"],
 "exports": {
 "import": {
 "types": "./dist/es/index.d.mts",
 "default": "./dist/es/index.mjs"
 },
 "require": {
 "types": "./dist/cjs/index.d.ts",
 "default": "./dist/cjs/index.js"
 }
 },
 "scripts": {
 "build": "bunchee"
 }
}

3.构建

在上面的配置步骤中，我们已经定义了构建脚本。您只需执行此脚本 - npm run build，index.ts 成为捆绑器的入口点并根据导出对象生成输出。

例如：src/index.ts 将匹配导出名称“.”或唯一的主要出口。

在 core/package.json 中导出

下面的代码选自 t3-env/packages/core/package.json。

"exports": {
 "./package.json": "./package.json",
 ".": {
 "types": "./dist/index.d.ts",
 "default": "./dist/index.js"
 },
 "./presets": {
 "types": "./dist/presets.d.ts",
 "default": "./dist/presets.js"
 }
},

在 nextjs/package.json 中导出

下面的代码选自 t3-env/packages/nextjs/package.json

"exports": {
 "./package.json": "./package.json",
 ".": {
 "types": "./dist/index.d.ts",
 "default": "./dist/index.js"
 },
 "./presets": {
 "types": "./dist/presets.d.ts",
 "default": "./dist/presets.js"
 }
},

在 nuxt/package.json 中导出

下面的代码选自 t3-env/packages/nuxt/package.json

"exports": {
 "./package.json": "./package.json",
 ".": {
 "types": "./dist/index.d.ts",
 "default": "./dist/index.js"
 },
 "./presets": {
 "types": "./dist/presets.d.ts",
 "default": "./dist/presets.js"
 }
},

关于我们：

在 Thinkthroo，我们研究大型开源项目并提供架构指南。我们开发了使用 Tailwind 构建的可重用组件，您可以在项目中使用它们。我们提供 Next.js、React 和 Node 开发服务。

与我们预约会面讨论您的项目。

参考：

1. https://www.npmjs.com/package/bunchee

2. https://github.com/t3-oss/t3-env/blob/main/packages/core/package.json#L40

以上是Bunchee，JS/TS 包的捆绑器的详细内容。更多信息请关注PHP中文网其他相关文章！