https://taroify.com/static/js/async/route-c7d79582ffae.0b4d66aff4.js

1"use strict";(self.rspackChunk_taroify_site=self.rspackChunk_taroify_site||[]).push([[8981],{7774:function(s,e,n){n.r(e);var i=n(8171),r=n(7301),l=n(9984),a=n(1736);function c(s){var e=(0,i._)({a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",ol:"ol",p:"p",pre:"pre",span:"span",ul:"ul"},(0,a.R)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(e.h1,{id:"开发指南",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#开发指南",children:"#"}),"开发指南"]}),"\n",(0,l.jsxs)(e.h3,{id:"介绍",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#介绍",children:"#"}),"介绍"]}),"\n",(0,l.jsx)(e.p,{children:"感谢你使用 Taroify。"}),"\n",(0,l.jsx)(e.p,{children:"以下是关于向 Taroify 提交反馈或代码的指南。在向 Taroify 提交 issue 或者 PR 之前，请先花几分钟时间阅读以下文字。"}),"\n",(0,l.jsxs)(e.h3,{id:"issue-规范",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#issue-规范",children:"#"}),"Issue 规范"]}),"\n",(0,l.jsxs)(e.ul,{children:["\n",(0,l.jsx)(e.li,{children:"遇到问题时，请先确认这个问题是否已经在 issue 中有记录或者已被修复"}),"\n",(0,l.jsx)(e.li,{children:"提 issue 时，请用简短的语言描述遇到的问题，并添加出现问题时的环境和复现步骤"}),"\n"]}),"\n",(0,l.jsxs)(e.h2,{id:"参与开发",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#参与开发",children:"#"}),"参与开发"]}),"\n",(0,l.jsxs)(e.h3,{id:"本地开发",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#本地开发",children:"#"}),"本地开发"]}),"\n",(0,l.jsx)(e.p,{children:"按照下面的步骤操作，即可在本地开发 Taroify 组件。"}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(e.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"bash",fold:!0,height:"420",children:(0,l.jsxs)(e.code,{children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 全局安装 rimraf"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"npm"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" install"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" -g"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" rimraf"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 克隆仓库"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 默认为 main 分支，包含 Taroify 的代码"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"git"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" clone"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" https://github.com/taroify/taroify.git"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 安装依赖"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"cd"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" taroify"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-punctuation)"},children:" &&"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:" pnpm"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" run"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" install:node_modules"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 进入开发模式，浏览器访问 http://localhost:8000"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"pnpm"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" run"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" develop"})]})]})})}),"\n",(0,l.jsxs)(e.h3,{id:"目录结构",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#目录结构",children:"#"}),"目录结构"]}),"\n",(0,l.jsxs)(e.ul,{children:["\n",(0,l.jsx)(e.li,{children:"仓库的组件代码位于 packages/core 下，每个组件一个文件夹"}),"\n",(0,l.jsx)(e.li,{children:"site 目录下是文档网站的代码，本地开发时可以运行 pnpm --dir site run site:develop 开启文档网站"}),"\n"]}),"\n",(0,l.jsx)(e.p,{children:"项目主要目录如下："}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(e.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"text",fold:!0,height:"420",children:(0,l.jsxs)(e.code,{children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"taroify"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"├─ bundles         # 构建"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"├─ packages/core   # 组件"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"├─ packages        # 子包"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"├─ site            # 文档"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"└─ scripts         # 脚本"})})]})})}),"\n",(0,l.jsxs)(e.h3,{id:"添加新组件",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#添加新组件",children:"#"}),"添加新组件"]}),"\n",(0,l.jsx)(e.p,{children:"添加新组件时，请按照下面的目录结构组织文件。"}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(e.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"text",fold:!0,height:"420",children:(0,l.jsxs)(e.code,{children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"src"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"└─ button"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ __tests__        # 单元测试"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ variables.scss   # 组件样式变量"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ button.tsx       # 具名组件"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ button.scss      # 组件样式"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ index.ts         # 组件入口"})}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{children:"   ├─ index.scss       # 组件样式入口"})})]})})}),"\n",(0,l.jsxs)(e.h2,{id:"提交-pr",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#提交-pr",children:"#"}),"提交 PR"]}),"\n",(0,l.jsxs)(e.h3,{id:"pull-request-规范",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#pull-request-规范",children:"#"}),"Pull Request 规范"]}),"\n",(0,l.jsxs)(e.ul,{children:["\n",(0,l.jsx)(e.li,{children:"如果遇到问题，建议保持你的 PR 足够小。保证一个 PR 只解决一个问题或只添加一个功能"}),"\n",(0,l.jsx)(e.li,{children:"当新增组件或者修改原有组件时，记得增加或者修改测试代码，保证代码的稳定"}

1),"\n",(0,l.jsx)(e.li,{children:"在 PR 中请添加合适的描述，并关联相关的 Issue"}),"\n"]}),"\n",(0,l.jsxs)(e.h3,{id:"pull-request-流程",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#pull-request-流程",children:"#"}),"Pull Request 流程"]}),"\n",(0,l.jsxs)(e.ol,{children:["\n",(0,l.jsx)(e.li,{children:"fork 主仓库，如果已经 fork 过，请同步主仓库的最新代码"}),"\n",(0,l.jsxs)(e.li,{children:["基于 fork 后仓库的 main 分支新建一个分支，比如",(0,l.jsx)(e.code,{children:"feature/button-color"})]}),"\n",(0,l.jsx)(e.li,{children:"在新分支上进行开发，开发完成后，提 Pull Request 到主仓库的 dev 分支"}),"\n",(0,l.jsx)(e.li,{children:"Pull Request 会在 Review 通过后被合并到主仓库"}),"\n",(0,l.jsx)(e.li,{children:"等待 Taroify 发布版本，一般是每周一次"}),"\n"]}),"\n",(0,l.jsxs)(e.h3,{id:"同步最新代码",children:[(0,l.jsx)(e.a,{className:"rp-header-anchor","aria-hidden":"true",href:"#同步最新代码",children:"#"}),"同步最新代码"]}),"\n",(0,l.jsx)(e.p,{children:"提 Pull Request 前，请依照下面的流程同步主仓库的最新代码："}),"\n",(0,l.jsx)(l.Fragment,{children:(0,l.jsx)(e.pre,{className:"shiki css-variables",style:{backgroundColor:"var(--shiki-background)",color:"var(--shiki-foreground)"},tabIndex:"0",lang:"bash",fold:!0,height:"420",children:(0,l.jsxs)(e.code,{children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 添加主仓库到 remote，作为 fork 后仓库的上游仓库"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"git"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" remote"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" add"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" upstream"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" https://github.com/taroify/taroify.git"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 拉取主仓库最新代码"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"git"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" fetch"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" upstream"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 切换至 dev 分支"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"git"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" checkout"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" main"})]}),"\n",(0,l.jsx)(e.span,{className:"line"}),"\n",(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-comment)"},children:"# 合并主仓库代码"})}),"\n",(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-function)"},children:"git"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" merge"}),(0,l.jsx)(e.span,{style:{color:"var(--shiki-token-string)"},children:" upstream/main"})]})]})})})]})}function h(){var s=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=(0,i._)({},(0,a.R)(),s.components).wrapper;return e?(0,l.jsx)(e,(0,r._)((0,i._)({},s),{children:(0,l.jsx)(c,(0,i._)({},s))})):c(s)}h.__RSPRESS_PAGE_META={},h.__RSPRESS_PAGE_META["contribution%2Findex.md"]={toc:[{id:"介绍",text:"介绍",depth:3},{id:"issue-规范",text:"Issue 规范",depth:3},{id:"参与开发",text:"参与开发",depth:2},{id:"本地开发",text:"本地开发",depth:3},{id:"目录结构",text:"目录结构",depth:3},{id:"添加新组件",text:"添加新组件",depth:3},{id:"提交-pr",text:"提交 PR",depth:2},{id:"pull-request-规范",text:"Pull Request 规范",depth:3},{id:"pull-request-流程",text:"Pull Request 流程",depth:3},{id:"同步最新代码",text:"同步最新代码",depth:3}],title:"开发指南",headingTitle:"开发指南",frontmatter:{title:"开发指南",description:"在本地开发、调试、测试并参与 Taroify 项目贡献。",pageType:"doc"}},n.d(e,{default:function(){return h}})}}]);