無料GitHub で公開
tinyvue-develop-spec
tinyvue组件库开发规范
日本語の概要は準備中です。原文の説明を表示しています。
opentiny/tiny-vueスター 2,267(GitHub 2,267 + cccskills 0)
実行スコア 未検証
インストール方法を見る含まれるファイル（12）
- SKILL.md3.4 KB
- common.skill.md7.8 KB
- design.skill.md9.9 KB
- directive.skill.md6.0 KB
- hooks.skill.md5.9 KB
- i18n-workflow.skill.md9.9 KB
- icon.skill.md1.3 KB
- renderless.skill.md9.4 KB
- testing-guide.skill.md11.2 KB
- theme.skill.md11.5 KB
- utils.skill.md5.7 KB
- vue.skill.md9.1 KB
SKILL.md（原文）
インストールする前に、エージェントに与えられる指示の中身を確認できます。
使用时机
在当前仓库进行组件的开发，主题开发，国际化开发，测试脚本开发时，必须遵守以下规范。
适用场景
- 新增 UI 组件
- 修改现有组件逻辑
- 重构组件架构
- 理解 Renderless 模式
重要术语
-
跨端模板： tiny vue组件库中，同一个组件可以有2种组件模板， 其中
pc.vue面向家用PC浏览器的场景，mobile-first.vue是移动优先的浏览器场景（可以兼容用户使用手机或PC浏览器）。 -
无渲染逻辑层: tiny vue组件库遵从模板和逻辑分离的原则进行开发。模板层只负责绑定变量和函数，所有的业务逻辑（data 处理、状态计算等）都要放在无渲染逻辑层
packages/renderless目录
组件库的架构
| 模块名称 | 代码目录 | 参考规范 | 说明 |
|---|---|---|---|
| 模板层 | packages/vue | ./vue.skill.md | 每个组件的模板，必须在相应的组件目录 |
| 无渲染逻辑层 | packages/renderless | ./renderless.skill.md | 每个组件的逻辑，必须在相应的组件目录 |
| 样式层 | packages/theme | ./theme.skill.md | 每个组件的样式，必须在相应的组件目录 |
| 设计规范层 | packages/design | ./design.skill.md | 交互规范、默认 props、图标与 renderless 扩展 |
| 适配Vue2/Vue3层 | packages/vue-common | ./common.skill.md | 非必要不修改适配层代码 |
| 图标库 | packages/vue-icon | ./icon.skill.md | 图标库 |
| 国际化层 | packages/vue-locale | ./i18n-workflow.skill.md | 组件的国际化 |
| 公用hooks | packages/vue-hooks | ./hooks.skill.md | 跨组件可以复用的hooks函数 |
| 公用指令 | packages/vue-directive | ./directive.skill.md | 跨组件可以复用的指令 |
| utils | packages/utils | ./utils.skill.md | 公用函数 |
| 组件测试 | examples/sites/demos/pc/app/**/*.spec.ts 或 packages/vue/src/**/__tests__ | ./testing-guide.skill.md | e2e测试和单元测试 |
| 文档开发 | examples/sites/demos/pc/app/** | ./vue.skill.md | 每一个组件的 api 和 demo 的开发 |
レビュー
まだレビューはありません。使ってみた感想をお寄せください。
コメント
ログインなしで書き込めます。使ってみた感想、質問、動かなかった環境などを気軽にどうぞ。
まだコメントはありません。最初のコメントを書いてみませんか。