Skip to content

Commit 06f98c0

Browse files
linhaylinhay
committed
chore: limit storybook public catalog
1 parent 6a0efc1 commit 06f98c0

6 files changed

Lines changed: 117 additions & 2 deletions

File tree

‎docs-linhay/dev/20260528-storybook-public-catalog-scope.md‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# Storybook 公开目录范围
2+
3+
## 背景
4+
`http://127.0.0.1:6006/` 是设计系统公开工作台入口，不再承担全量业务组件验收。此前 Storybook 通过 `../src/**/*.stories.@(ts|tsx|mdx)` 加载所有 story，导致 `frontend/src/features/**` 下的业务组件全部进入 6006 侧栏。
5+
6+
## 当前边界
7+
6006 只加载以下三类 story：
8+
9+
1. `frontend/src/stories/tokens/**/*.stories.@(ts|tsx|mdx)`
10+
2. `frontend/src/stories/primitives/**/*.stories.@(ts|tsx|mdx)`
11+
3. `frontend/src/components/ui/**/*.stories.@(ts|tsx|mdx)`
12+
13+
6006 的公开 Storybook catalog 只统计 tokens、基础样式和通用 UI 组件。业务设计系统任务交给 `http://127.0.0.1:5173/#frame=design-system`，应用内 5173 catalog 继续保留 `feature-components` 分组。
14+
15+
## 保留策略
16+
`frontend/src/features/**/**/*.stories.tsx` 暂不删除。这些 story 仍可作为 feature-owned 的内部验收素材、历史 mock 数据和 5173 业务设计系统入口的定向收编参考，但不能通过 6006 的默认公开目录暴露。
17+
18+
`componentManifest.ts` 中已有的业务组件收编记录暂时保留，用于追踪历史设计系统资产和 mock 状态。后续如果要重新开放某个业务组件，必须先明确它已经从业务域抽象为通用组件，再移动到允许的公开 story 目录。
19+
20+
## 回归约束
21+
`frontend/src/features/design-system/storyCatalog.test.mjs` 负责锁定以下规则：
22+
23+
1. Storybook 配置不能回退到 `../src/**/*.stories.@(ts|tsx|mdx)`。
24+
2. Storybook 配置不能包含 `features/**`。
25+
3. 5173 应用内 catalog 必须保留 `feature-components`，用于承接业务设计系统任务。
26+
4. 6006 的 Storybook 配置和构建产物不能包含 `Design System/业务组件`、`feature-components` 或 `frontend/src/features/`。

‎docs-linhay/memory/2026-05-28.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,3 +103,10 @@
103103
- 回归测试新增 `TestGetClaudeCodeExtensionsSnapshotScansAgentSkillRoots`，验证 `.agents/skills` 下的用户级和项目级 `SKILL.md` 都能被扫描到。
104104
- 已同步更新 `20260521-claude-code-codex-alignment` space 与 `.agents/skills/gettokens-domain-engineering/SKILL.md` 的 Claude Code workspace parity 规则。
105105
- 本机 Wails dev 页面验收通过：`http://127.0.0.1:34115/#frame=claude&workspace=skills` 显示 `41 SKILLS`，包含 `~/.agents/skills` 的 user skills 和项目 `.agents/skills` 的 project skills；截图归档到 `docs-linhay/spaces/20260521-claude-code-codex-alignment/screenshots/20260528/claude/20260528-claude-skills-scan-after-v01.png`。
106+
107+
## Storybook 移除全量业务组件
108+
- `20260528-storybook-remove-business-components` 已完成：6006 Storybook 不再加载全量 `frontend/src/features/**` 业务 stories，只保留 tokens、primitives 和 `frontend/src/components/ui`。
109+
- 用户明确业务设计系统任务交给 `http://127.0.0.1:5173/#frame=design-system`；因此 5173 应用内 catalog 继续保留 `feature-components` 分组，6006 构建产物不暴露业务组件。
110+
- 技术边界已记录到 `docs-linhay/dev/20260528-storybook-public-catalog-scope.md`：公开 6006 目录不得回退到 `../src/**/*.stories`，也不得包含 `features/**`；业务 story 文件和 `componentManifest.ts` 的历史收编记录暂不删除。
111+
- 验证通过：`node --test frontend/src/features/design-system/storyCatalog.test.mjs`、`npm --prefix frontend run typecheck`、`npm --prefix frontend run build-storybook`、`npm --prefix frontend run build`；live `http://127.0.0.1:6006/index.json` 为 36 条 story，未出现 `Design System/业务组件`、`feature-components` 或 `frontend/src/features`。
112+
- 验收截图已归档：`docs-linhay/spaces/20260528-storybook-remove-business-components/screenshots/20260528/design-system/20260528-storybook-no-business-components-after-v01.png`。

‎docs-linhay/spaces/20260528-storybook-remove-business-components/README.md‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
# 20260528-storybook-remove-business-components
2+
3+
## 背景
4+
`http://127.0.0.1:6006/` 当前由 Storybook 直接加载 `../src/**/*.stories.@(ts|tsx|mdx)`，导致 `frontend/src/features/**` 下的全量业务组件都出现在设计系统工作台中。
5+
6+
这让 6006 入口承担了过多业务验收内容。当前要求是移除全量业务组件，只保留设计系统基础层：tokens、基础样式和通用 UI 组件。
7+
8+
## 目标
9+
1. Storybook 6006 不再显示 `Design System/业务组件/*`。
10+
2. Storybook 配置不再使用全量 `src/**/*.stories`。
11+
3. 业务设计系统任务交给 `http://127.0.0.1:5173/#frame=design-system`，应用内 5173 catalog 继续保留 `feature-components` 分组。
12+
4. 业务组件 story 文件暂不删除，作为历史/后续定向验收素材保留。
13+
14+
## 范围
15+
1. `frontend/.storybook/main.ts` 的 stories include 范围。
16+
2. `frontend/src/features/design-system/storyCatalog.ts` 的公开目录分组。
17+
3. `frontend/src/features/design-system/storyCatalog.test.mjs` 的回归约束。
18+
19+
## 非目标
20+
1. 不删除 `frontend/src/features/**/**/*.stories.tsx` 文件。
21+
2. 不改运行时业务组件的 `data-design-system-component` 标记。
22+
3. 不整理 `componentManifest.ts` 的历史收编记录。
23+
24+
## 验收标准
25+
1. Given 打开 `http://127.0.0.1:6006/`，When 查看侧栏，Then 不出现 `Design System/业务组件` 分组。
26+
2. Given 构建 Storybook，When 读取 `storybook-static/index.json`，Then 不包含任意 `Design System/业务组件/*` story。
27+
3. Given 打开 `http://127.0.0.1:5173/#frame=design-system`，When 查看应用内设计系统页，Then 业务组件仍由 `feature-components` 分组承接。
28+
4. Given 后续新增 story，When 运行设计系统单元测试，Then `frontend/.storybook/main.ts` 不能回退到 `../src/**/*.stories` 全量加载。
29+
30+
## 设计稿入口
31+
32+
- 本期设计稿：`（未产出）`
33+
- 约束：单期只保留一个 HTML 文件；若存在多稿对比，也必须收敛在同一个 HTML 文件内。
34+
35+
## Worktree 映射
36+
37+
- branch：`feat/20260528-storybook-remove-business-components`
38+
- worktree：`../GetTokens-worktrees/20260528-storybook-remove-business-components/`
39+
40+
## 相关链接
41+
- 技术边界：[`docs-linhay/dev/20260528-storybook-public-catalog-scope.md`](../../dev/20260528-storybook-public-catalog-scope.md)
42+
- 验收截图：[`screenshots/20260528/design-system/20260528-storybook-no-business-components-after-v01.png`](screenshots/20260528/design-system/20260528-storybook-no-business-components-after-v01.png)
43+
44+
## 当前状态
45+
- 状态：done
46+
- 最近更新：2026-05-28
47+
48+
## 验收记录
49+
1. `frontend/.storybook/main.ts` 已从全量 `../src/**/*.stories.@(ts|tsx|mdx)` 收敛为 tokens、primitives、`components/ui` 三类基础入口。
50+
2. `frontend/src/features/design-system/storyCatalog.ts` 继续保留 `feature-components` 分组，业务设计系统任务归口到 5173 应用开发态入口。
51+
3. `storybook-static/index.json` 和 live `http://127.0.0.1:6006/index.json` 均验证为 36 条 story，且不包含 `Design System/业务组件`、`feature-components` 或 `frontend/src/features`。
52+
4. 截图已归档到本 space 的 `screenshots/20260528/design-system/` 目录。

‎frontend/.storybook/main.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import type { StorybookConfig } from '@storybook/react-vite';
22

33
const config: StorybookConfig = {
4-
stories: ['../src/**/*.stories.@(ts|tsx|mdx)'],
4+
stories: [
5+
'../src/stories/tokens/**/*.stories.@(ts|tsx|mdx)',
6+
'../src/stories/primitives/**/*.stories.@(ts|tsx|mdx)',
7+
'../src/components/ui/**/*.stories.@(ts|tsx|mdx)',
8+
],
59
addons: ['@storybook/addon-docs', '@storybook/addon-themes'],
610
framework: {
711
name: '@storybook/react-vite',

‎frontend/src/features/design-system/storyCatalog.test.mjs‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,32 @@ test('design system story stats match flattened catalog', () => {
109109
assert.ok(stats.storyCount >= 10);
110110
});
111111

112+
test('storybook public catalog excludes full business components', async () => {
113+
const storybookConfigSource = await readFile(new URL('../../../.storybook/main.ts', import.meta.url), 'utf8');
114+
const storybookStoryPaths = Array.from(storybookConfigSource.matchAll(/'([^']+\.stories\.\@\(ts\|tsx\|mdx\))'/g))
115+
.map((match) => match[1]);
116+
const featureComponentGroup = getCatalogGroup('feature-components');
117+
118+
assert.deepEqual(storybookStoryPaths, [
119+
'../src/stories/tokens/**/*.stories.@(ts|tsx|mdx)',
120+
'../src/stories/primitives/**/*.stories.@(ts|tsx|mdx)',
121+
'../src/components/ui/**/*.stories.@(ts|tsx|mdx)',
122+
]);
123+
assert.doesNotMatch(storybookConfigSource, /\.\.\/src\/\*\*\/\*\.stories/);
124+
assert.doesNotMatch(storybookConfigSource, /features\/\*\*/);
125+
assert.ok(featureComponentGroup, 'business design-system catalog stays assigned to the 5173 app entry');
126+
127+
for (const story of featureComponentGroup.stories) {
128+
assert.match(story.path, /frontend\/src\/features\//, `${story.path} must stay in the 5173 business design-system catalog`);
129+
assert.match(story.storybookTitle, /Design System\/业务组件/, `${story.storybookTitle} must remain a business design-system title`);
130+
}
131+
132+
for (const story of flattenDesignSystemStories(designSystemStoryGroups).filter((item) => item.path.includes('/components/ui/') || item.path.includes('/stories/'))) {
133+
assert.doesNotMatch(story.path, /frontend\/src\/features\//, `${story.path} must stay out of the public Storybook catalog`);
134+
assert.doesNotMatch(story.storybookTitle, /Design System\/业务组件/, `${story.storybookTitle} must stay out of Storybook 6006`);
135+
}
136+
});
137+
112138
test('modal frame is admitted as a shared design-system component', () => {
113139
const componentsGroup = getCatalogGroup('components');
114140
assert.ok(componentsGroup);

‎frontend/src/features/design-system/storyCatalog.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ export const designSystemStoryGroups = [
167167
{
168168
id: 'feature-components',
169169
title: '业务组件',
170-
description: '已用 mock 数据纳入设计系统的业务级组件。',
170+
description: '已用 mock 数据纳入 5173 应用开发态设计系统的业务级组件。',
171171
stories: [
172172
{
173173
id: 'debug-panel-components',

0 commit comments

Comments
 (0)