@cobre-npm/ds-v3

中文文档
0.169.0发布于 2026/11/06TypeScriptES Module近 30 天下载 4236

Vue 3 + Cobre 平台的 TypeScript 组件库,通过文件记录和开发 故事书。 。 。 .

中文使用文档
文档目录11 节
  1. 先决条件
  2. 项目设置
  3. 与故事书一起开发(主要工作流程)
  4. 常见命令
  5. 测试
  6. 覆盖层的缝隙
  7. 添加测试
  8. 建议的 IDE 设置
  9. 类型支持 .vue TS 进口
  10. 项目结构和公约
  11. 解决问题

Cobre设计系统V3(@cobre-npm/ds-v3(中文(简体) )

Vue 3 + Cobre 平台的 TypeScript 组件库,通过文件记录和开发 故事书。 。 。 .

抬头: 本项目使用 小时而不是npm。 (笑声) 运行 npm install 将生成一个偏差 package-lock.json 并且能产生一个破裂的、 node_modules。总是使用 pnpm。 。 。 .

先决条件

  • 节点.js 20 (CI使用节点24).
  • 小时 十. 准确的版本通过 packageManager 输入 package.json,所以最简单的设置是让 核心软件包 和它比对:
    corepack enable
    
    要手动安装 : npm install -g pnpm。 。 。 .

项目设置

pnpm install

更新检出时, pnpm 可能会提示您批准本地依赖的构建脚本( Nameesbuild, (中文(简体) ), @swc/core, (中文(简体) ), @parcel/watcher, (中文(简体) ), unrs-resolver, (中文(简体) ), vue-demi) (中文(简体) ). 如果是,请批准:

pnpm approve-builds

然后重新运行 pnpm install 如果需要的话.

postinstall 下载渲染道测试的无头铬( ~95 MB, 每条一次) (原始内容存档于2013-10-10). machine, idempotent. 它住在这里 postinstall 而不是在测试脚本中,因为浏览器是 套房的依赖性,并且因为不止一个指令运行该套房——放入其中 test 没有浏览器就留下了其他的入口. SKIP_TEST_BROWSER=1 跳过它,对于任何安装依赖性且从未运行套房的图像—— 构建故事书的多克文件设置了它。 在高山上它跳过自己,因为 Playwright 出版只建立 glibc. --ignore-scripts 也跳过,而且 pnpm test:browsers 把它拿回来.

与故事书一起开发(主要工作流程)

这是一个组件库——日常的开发发生在"故事书"中,这使得每个组件的变体和文件:

pnpm storybook

打开时间 http://localhost:6006 (英语)。 。 。 .

pnpm dev 页:1 vite)只服务于最低限度 src/main.ts 编号 : App.vue 绳子。 没错 没有 组件相册——使用 pnpm storybook 用于正常发展.

常见命令

命令它会做什么
pnpm install安装依赖关系
pnpm storybook在端口 6006 运行 Storybook dev 服务器( 主要 Dev 工作流程)
pnpm dev裸露的Vite Dev带(src/main.ts)——很少需要
pnpm build类型检查 + 将可出版库建入 dist/
pnpm build-storybook构建静态故事书网站
pnpm test整个大门:故事渲染道,逻辑道 有覆盖,变化无常
pnpm test:stories仅使用 Render 道 —— 以无头 Chromium 装上所有 81 个故事
pnpm test:unit仅逻辑道,对 coverage-floor.json
pnpm test:browsers重新下载Chrimium建造了变形道的需要——通常没有必要, pnpm install 这样做
pnpm lint自动修正( A) ESLint 语录

测试

套房分成两道 因为两个号码不是同一件事 (单位:千美元)ADR-0008 (英语):

  • 渲染道 (单位:千美元)test:stories)——每个故事无出错地上载出无头Chromium通过 @storybook/addon-vitest这是 二进制:不附带百分比。 故事书标记a 当一个故事写出来,却无动于衷时 措施 已执行没有 已核实。 。 。 .
  • 逻辑道 (单位:千美元)test:unit——非构成部分来源(src/**/*.ts 减去故事,测试, 仅限类型模块、桶和dev条目),并强制执行覆盖阈值.

覆盖层的缝隙

coverage-floor.json 守住门槛,它就是 一层楼,不是目标它被设定为什么 门被打开的当日测量的回购——没有追溯95%,也没有回填 作为先决条件的现有组成部分。 它只能上升:

  • scripts/check-invariants.mjs 当文件中的任何数字下降到基数以下时, 构建失败 参考: 是一个变化级别检查,所以它运行在 CI, 或本地与 pnpm test:invariants -- --base origin/trunk。 。 。 .
  • src/utils/repo-invariants.test.ts 失败当 vitest.config.mts 停止读取其阈值 从文件, 否则, 这将是一个沉默的方式 将门 降为一无所有.

提高地板:提高覆盖率,运行 pnpm test:unit,并将报告的总数复制到 coverage-floor.json。 。 。 .

添加测试

成份行为属于一个故事——那就是已经存在的道和消耗性的道 应用读取为文档 。 到达逻辑道, 当主体是一个可调和, 纯 函数或共享状态.

虚拟系统 + 键 Vue - 官方(伏尔) (残疾维图尔.

类型支持 .vue TS 进口

类型脚本无法键入 .vue 自己进口,所以我们使用 vue-tsc 用于类型检查和 Vue (Volar) 扩展以让编辑器的 TS 语言服务了解 .vue 类型.

项目结构和公约

见 CLAUDE.md 结构概况:原子设计布局atoms编号 :molecules编号 :organisms页:1 Cobre* 编号 : co- 命名公约、SCSS令牌系统以及如何添加新的组件(每个组件都生活在自己的文件夹中,有一个 .vue页:1 .stories.ts,则 index.ts,必须从 src/components/index.ts 财务报告和审定财务报表 src/index.ts) (中文(简体) ).

解决问题

  • npm run dev 编号 : npm install 失败或行为异常 你用错了包管理器 删除任何 package-lock.json,然后使用 pnpm install。 。 。 .
  • pnpm 请求批准构建脚本 - 运行 pnpm approve-builds,然后重运行 pnpm install 如果需要的话.
  • 断接或断接 node_modules —— 说 rm -rf node_modules && pnpm install。 。 。 .

版本与发布记录

@cobre-npm/ds-v3 共发布 428 个版本,首次发布于 2024/07/03;过去 12 个月发布了 180 个版本。

版本发布日期距今
0.169.0latest2026/11/063 天前
0.168.02026/10/3011 天前
0.167.02026/10/3011 天前
0.166.02026/10/2911 天前
0.165.02026/10/2813 天前
0.164.12026/10/2713 天前

关于 @cobre-npm/ds-v3 的常见问题

@cobre-npm/ds-v3 是什么?

Vue 3 + Cobre 平台的 TypeScript 组件库,通过文件记录和开发 故事书。 。 。 .

如何安装 @cobre-npm/ds-v3?

在项目目录运行 npm install @cobre-npm/ds-v3,或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖:date-fns(^2.30.0)、date-fns-tz(^2.0.1)、@vuepic/vue-datepicker(^9.0.3)。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖,Yarn 需要手动安装。

@cobre-npm/ds-v3 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@cobre-npm/ds-v3 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@cobre-npm/ds-v3 需要什么版本的 Node.js?

package.json 的 engines 字段要求 Node.js >=20。版本不符时 npm 默认只给出警告,开启 engine-strict 后会拒绝安装。

@cobre-npm/ds-v3 可以商用吗?

@cobre-npm/ds-v3 使用 未声明 许可。package.json 没有声明许可证。没有许可证的代码默认保留全部权利,商用前请联系作者或查看仓库中的 LICENSE 文件。以上为概括,不构成法律意见,请以许可原文为准。

@cobre-npm/ds-v3 的下载量有多少?

根据 npm 官方下载统计,@cobre-npm/ds-v3 在 2026/10/10 – 2026/11/08 这 30 天内被下载 4,236 次,日均约 141 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@cobre-npm/ds-v3 还在维护吗?

最新版本 0.169.0 发布于 2026/11/06(3 天前);至今共发布 428 个版本,其中过去 12 个月发布了 180 个;首次发布于 2024/07/03。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。