# @bitrise/bitkit-v2 中文文档 规范地址：https://npmcn.com/package/%40bitrise/bitkit-v2/ 版本：0\.3\.521 npm 元数据更新时间：2026-11-06T16:04:01.348Z 中文译文更新时间：2026-11-08T04:42:05.624Z 软件包许可：MIT 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40bitrise/bitkit-v2 原文对照：https://npmcn.com/package/%40bitrise/bitkit-v2/?lang=original 项目主页：https://github.com/bitrise-io/bitkit-v2#readme 源码仓库：https://github.com/bitrise-io/bitkit-v2 ## 关键信息（来自 npm 元数据） - 包体积（解压后）：5.9 MB，3042 个文件 - 模块格式：ES Module - TypeScript 类型：包内自带 - 运行依赖：7 个 - peer 依赖：react \>=18，react-dom \>=18，@chakra-ui/cli 3\.37\.0，@emotion/react 11\.14\.0，@chakra-ui/react 3\.37\.0 - 首次发布：2025-08-15T14:00:17.107Z - 最新版本发布：2026-11-06T16:04:01.109Z - 近 30 天下载量：19623（2026-10-08 至 2026-11-06，npm 官方下载统计） - 已发布版本数：680（近 12 个月 626 个） ## 中文简介 用 Chakra UI V3 构建的 Bitrise 设计系统组件 ## 安装 ```sh npm install @bitrise/bitkit-v2 ``` 也可以使用：`pnpm add @bitrise/bitkit-v2`、`yarn add @bitrise/bitkit-v2`、`bun add @bitrise/bitkit-v2` ## README # @ bitrise/ bitkit-v2 (英语) [![npm version](https://img.shields.io/npm/v/%40bitrise%2Fbitkit-v2)](https://www.npmjs.com/package/@bitrise/bitkit-v2) Bitrise 设计系统组件由 Chakra UI v3. [在故事书中浏览组件库](https://storybook.services.bitrise.dev/projects/bitkit-v2/production/) (需要谷歌认证) ## 使用 AI 助手( Claude Code, Cursor, Codex等) 如果你是原型 或气相编码 与AI助手,做到这一点 **在此之前** 写入任何 Bitkit 代码 : **1\. 配置主机故事书MCP** 因此AI可以查询活的组件道具,示例和符号而不是猜测. 添加到您的项目 `.mcp.json`数字 : ```json { "mcpServers": { "bitkit-storybook-mcp": { "url": "https://storybook.services.bitrise.dev/projects/bitkit-v2/production/mcp", "type": "http" } } } ``` **2\. 参考比特基特语 `AGENTS.md`** 所以人工智能会收集部分命名 `state` 道具图案,语义符号规则等图书馆惯例. 添加到您的项目 `AGENTS.md` (或 `CLAUDE.md`: ```markdown @./node_modules/@bitrise/bitkit-v2/AGENTS.md ``` 主机故事书本身可浏览于 [https://storybook.services.bitrise.dev/projects/bitkit-v2/production/ 页面存档备份,存于互联网档案馆](https://storybook.services.bitrise.dev/projects/bitkit-v2/production/) (需要Google 认证). ## 特征 - **自定义设计系统**: 完成Bitrise品牌的实施 - **由 Chakra UI v3 所建** 最新 Chakra UI 特性和性能 - **类型脚本**: 带有自动生成类型的完整类型脚本支持 - **自办字体**: Figtree 和源代码 Pro 通过 Bitkit 提供器捆绑 - **固定同伴依赖关系**: Bitkit宣布查克拉,情感和查克拉CLI为被钉住的同龄人,因此你的树会被解开 ## 安装 ```bash # Runtime peers — required for Bitkit to render npm install @bitrise/bitkit-v2 @chakra-ui/react@3.37.0 @emotion/react@11.14.0 # Build-time peer — required so the bundled postinstall hook can generate bitkit-specific theme typings npm install --save-dev @chakra-ui/cli@3.37.0 ``` Chakra UI和情感被宣布为对等依赖,所以主机app在树上拥有Chakra的单拷贝. 安装在精确版本的 Bitkit 披针上 —— 任何其他版本(包括补丁凸起等) `3.37.1`)触发了同位点不匹配的警告,不同的次要/主要也可能对 Bitkit 的编译输出造成运行时 API 不兼容 。 重复 Chakra 安装时, 只有在其它的过渡依赖性拖入漂移上不同的 Chakra 版本时才会出现, 但当它们被拖倒时, 才会悄悄地中断 `BitkitProvider`其主题上下文, 正好就是被绑住的失败模式对等者所防范的 . `@chakra-ui/cli` 也是对等者——比特基特 `postinstall` 钩子用来生成 Chakra 主题输入到您的工程中 `node_modules`. 将它安装为主机应用程序中的 devdependency,以便钩子找到. > **仅限生产安装(`npm ci --omit=dev`, (中文(简体) ), `pnpm install --prod`等 :** 因为 `@chakra-ui/cli` 通常安装在主机中 `devDependencies`,它将被跳过——您的软件包管理器可能会发出一个未满足的对等警告,或者在严格的同行执行下(例如 pnpm ) `strict-peer-dependencies=true`),失败安装. 捆绑 `postinstall` 钩子本身检测出缺失的CLI,打印出一个通知并干净地退出. 主题打字是开发时的考虑, 因此生产环境不需要 CLI; 如果您的 prod 安装配置为严格的对等器, 要么设置 `strict-peer-dependencies=false` 用于部署步骤,允许列表 `@chakra-ui/cli` 作为缺少的对等点,或将CLI安装为常规依赖而非devdependency. ### 所需资源 - 反应 18 + (同类依赖) - 反应 DOM 18+( 同类依赖) - `@chakra-ui/react` 3.37.0 (依赖性较强,固定) - `@emotion/react` 11.14.0(依赖性较强,被钉住) - `@chakra-ui/cli` 3.3.7.0 (同属依赖,被捆绑使用) `postinstall` typegen hook; 在主机应用程序中安装为 devDependency) ### 主题打字 Bitkit将 Chakra UI v3 主题装入自定义的食谱,语义符号和设计符号. 对于 TypeScript 自动补全以识别比特Kit 特定值(例如. ``, (中文(简体) ), `colors.purple.60`Chakra的型号必须运行在您的项目中 `node_modules` 安装后. 自动通过 `postinstall` 钩被包裹了,只要 `@chakra-ui/cli` 被安装在主机应用程序中(由于这个原因它被宣布为对等依赖). 如果邮站被跳过(例如:. `@chakra-ui/cli` 未安装, 您运行 `npm install --ignore-scripts`,或 CI 跑步器阻断生命周期脚本),手动再生成打字: ```bash npx chakra typegen node_modules/@bitrise/bitkit-v2/dist/theme/index.js ``` 你可以通过检查来验证它是否有效 `` 在编辑器中检查类型 `` 错误. ## 快速启动 ```tsx import { BitkitProvider, BitkitButton } from '@bitrise/bitkit-v2'; function App() { return ( Hello Bitrise! ); } ``` ## 发展 ### 所需资源 - 节点.js 24.x+(参见 `.tool-versions` 用于开发的精确版本) ### 图标 ```bash # Install dependencies npm install # Start Storybook npm run storybook # Build the library npm run build # Generate theme types npm run theme:generate-types ``` ### 从 Figma 导出 SVG 图标 首先, 您应该创建一个 Figma Personal Access Token 到 Bitkit 基金会文件 : [https://help.figma.com/hc/en-us/articles/8085703771159-Manage-个人-访问-tokens (中文(简体) )](https://help.figma.com/hc/en-us/articles/8085703771159-Manage-personal-access-tokens) ```bash FIGMA_TOKEN= npm run generate:icons ``` #### 手动图标覆盖 少数图标是手自维护而来,而不是取自Figma(如拖柄,动画自旋器等). 手动图标总是使用 **两者** 一起标记 : 1. **`*.manual.svg`** - 指定来源 `icon--.manual.svg`。每次运行时,生成器都会删除任何已导出图像 `icon--.svg` 带有 `.manual.svg` 师兄,所以 `figma-export` 能够 **永远** 覆盖它。 绘制单色图标 `#2B0E3F` (svgr将其改写为: `currentColor`) (中文(简体) ). 2. **`// @generate:skip`** 首行中 `.tsx` ——所以发电机永远不会再生组件. 仍然出口,只要 `.manual.svg` 存在于 `lib/svgs/`。 。 。 . ```tsx // @generate:skip // Manually maintained icon. import { Icon, type IconProps } from '@chakra-ui/react/icon'; // ... import the *.manual.svg and render it ``` 当前手工图标 : `IconDragHandle` 编辑 `IconSpinner*` 图标(旋转器也默认) `color` 对语义 `icon/*` 符号). 其他一切来自法格玛——留给发电机. ## 许可证 麻省理工学院 ## 捐款 请看我们的 [提供指南](https://npmcn.com/package/%40bitrise/bitkit-v2/CONTRIBUTING.md)。 。 。 . ## 常见问题 ### @bitrise/bitkit-v2 是什么？ 用 Chakra UI V3 构建的 Bitrise 设计系统组件 ### 如何安装 @bitrise/bitkit-v2？ 在项目目录运行 npm install @bitrise/bitkit-v2，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=18）、react-dom（\>=18）、@chakra-ui/cli（3\.37\.0）、@emotion/react（11\.14\.0）、@chakra-ui/react（3\.37\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。 ### @bitrise/bitkit-v2 支持 TypeScript 吗？ 支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。 ### @bitrise/bitkit-v2 支持 ESM 还是 CommonJS？ 以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。 ### @bitrise/bitkit-v2 可以商用吗？ @bitrise/bitkit-v2 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。 ### @bitrise/bitkit-v2 的下载量有多少？ 根据 npm 官方下载统计，@bitrise/bitkit-v2 在 2026/10/08 – 2026/11/06 这 30 天内被下载 19,623 次，日均约 654 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @bitrise/bitkit-v2 还在维护吗？ 最新版本 0\.3\.521 发布于 2026/11/07（1 天前）；至今共发布 680 个版本，其中过去 12 个月发布了 626 个；首次发布于 2025/08/15。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。