github 上開源一個組件,而且內置到 umi+antd 系列中能夠快速的獲得更多的反饋,而且能夠得到一些 PR 幫助咱們的技術棧快速成長。可是Github 有一套本身的工做流,對於習慣內部系統的咱們仍是有一些上手成本,這篇文章會列舉一些工具幫助咱們更好的開始本身的開源生涯,早日成爲名望程序員。node
GitHub 做爲一箇中心化的 git 管理平臺,須要一個帳號來進行開發和管理本身的倉庫。註冊號帳號之後就能夠 clone 倉庫來進行開發了,以 antd 爲例咱們可使用 ssh 和 https 兩種方式進行開發,這裏推薦使用ssh,https 的鑑權比較麻煩,常常會失敗。git
咱們能夠在 SSH 配置中 配置本身的 SSH keys,設置以後就能夠完美的支持各類的倉庫的 clone,若是仍是想使用 https,推薦使用微軟爸爸的提供的 GCMC 解決方案,而且安裝 GitHub Desktop 和 VScode 的github 插件, vscode 提供了一個詳細的教程來配置咱們的工做流。程序員
爲了提高帳號的安全性,咱們推薦打開 GitHub 的兩步驗證,因爲 GitHub 不支持中國大陸的手機,咱們須要使用鑑權 App,這裏推薦使用 微軟 Authenticator 來支持,它能夠方便的在國內使用。固然 google play 上還有一系列 APP, 能夠自行選擇。github
若是咱們須要管理一個倉庫,推薦安裝 gh ,GitHub 官方出品。web
這裏列舉幾個很是經常使用的命令:npm
// 在瀏覽器中打開當前的倉庫
gh repo view -w
// 用當前的分支提一個pr
gh pr create
// 查看當前分支提供的 pr
gh pr view -w
複製代碼
通常而言 github 的工做流,會先 checkout 一個分支,在分支上開發完成以後,提交一個 PR, Approve 以後就能夠就能夠 merge 到 master 等待時間發佈。ubuntu
pull requests 的簡稱,字面意思是但願別人 pull 你的代碼,是但願倉庫將你的代碼合併到倉庫中。常見用法 : 來個 pr ?windows
字面意思是問題,是 github 提供的用來跟蹤 bug 或者需求的工具,提了 issue 通常會異步解決。 常見用法 : 提個 issue 吧瀏覽器
Collaborator _ 表明是某個倉庫的維護人員,若是是某個倉庫的 Collaborator 表明你給這個倉庫貢獻過代碼。 常見用法: 我發現 xxx 有個錯別字,正好去蹭個 Collaborator安全
_ 贊同,做爲倉庫的全部人贊成了這個 pr以後,就能夠點擊 Approve 來贊成這個提交,通常要求比較嚴格的倉庫都須要至少一票 Approve 。常見用法: 乞討 Approve 更多名字能夠看這裏 docs.github.com/cn/github/g…
如今的 多 repo 已經很是多,爲了方便的使用,通常會使用 learn+yarn ,yarn 的 workspaces 對多 repo 提供了良好的支持。這裏推薦使用 tyarn。能夠這樣安裝 :
npm i yarn tyarn -g
複製代碼
github 提供了不少工具來提高咱們的開發體驗,基本上覆蓋了咱們全流程的開發任務,咱們能夠在 GitHub 上新建任務,管理 issue ,管理版本,發佈網站,依託 github 提供的各類功能,咱們能夠更流暢的開發。
在開發階段咱們可使用 github 中咱們可使用 github actions 來新建一個 CI。 只要在項目根目錄中 .github/workflows
新建一個 xx.yml
。這裏有個簡單的 CI 能夠在每次 commit 中發起一個測試。
name: Node CI
on: [push, pull_request]
jobs:
build:
runs-on: ${{ matrix.os }}
strategy:
matrix:
node_version: [12.x]
os: [ubuntu-latest, windows-latest]
steps:
- uses: actions/checkout@v1
- name: Use Node.js ${{ matrix.node_version }}
uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node_version }}
- run: echo ${{github.ref}}
- run: yarn
- run: yarn run lint
- run: yarn run tsc
- run: yarn run build
- run: yarn run test
env:
CI: true
PROGRESS: none
NODE_ENV: test
NODE_OPTIONS: --max_old_space_size=4096
複製代碼
在 .github
中 ISSUE_TEMPLATE 中新建一個 xxx.md
能夠提供一個 issue 的模板。
---
name: '疑問或須要幫助 ❓'
about: 對 Ant Design Pro 使用的疑問或須要幫助
title: '🧐[問題]'
labels: '🧐question'
assignees: ''
---
### 🧐 問題描述
<!--
詳細地描述問題,讓你們都能理解
-->
### 💻 示例代碼
<!--
若是你有解決方案,在這裏清晰地闡述
-->
### 🚑 其餘信息
<!--
如截圖等其餘信息能夠貼在這裏
-->
複製代碼
GitHub 上有不少方便的 actions 模板能夠輕鬆使用,例如 rebase 和 github pages,咱們的項目開發到必定階段時就須要一個網站來進行預覽和發佈。github 提供了 github pages 來幫助咱們實現功能,它能夠支持 https 和 自定義域名。咱們通常會經過 CI 來發布 github pages, 這裏有一個 actions 能夠自動部署 mater 的代碼到 github pages。
name: Deploy CI
on: [push]
jobs:
build-and-deploy:
runs-on: ubuntu-latest
if: github.ref == 'refs/heads/master'
steps:
- name: Checkout
uses: actions/checkout@master
- run: yarn
- run: npm run lint
# - run: yarn run tsc
- name: Build and Deploy
uses: JamesIves/github-pages-deploy-action@master
env:
CI: true
GA_KEY: UA-72788897-6
PROGRESS: none
GIT_CONFIG_NAME: qixian.cs
GIT_CONFIG_EMAIL: qixian.cs@outlook.com
NODE_OPTIONS: --max_old_space_size=4096
ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: site
GITHUB_TOKEN: ${{ secrets.ACTION_TOKEN }}
BRANCH: gh-pages
FOLDER: 'dist/'
BUILD_SCRIPT: yarn && npm run site && git checkout . && git clean -df
複製代碼
發佈網站以後咱們可能須要發佈一下版本。這裏推薦使用 np 來進行發佈,能夠減小發布的工做量,它提供了一個交互式 的發佈工具來幫助咱們發佈版本。
更多的工具能夠在 antd 的倉庫抄一下 github.com/ant-design/…
codecov 如今已是事實上的標準,幾乎每一個開源庫都會接入它。並且它是徹底免費的。接入一個開源項目很是簡單,只要一行代碼。
bash <(curl -s https://codecov.io/bash)
複製代碼
固然你要先去的官網註冊一下,umi 也提供了 umi test:coverage
來支持 codecov。
badge 能夠快速的展現一些小信息,幫助提高社會地位。
shields.io 支持各類 badge,你也能夠自定義一下本身的 badge。
在進行了初始的開發以後咱們就須要一些自定義之類的高端玩法。
這裏推薦在 godaddy 購買域名,在 cloudflare 進行域名申請。咱們只須要在 github 中增長對象 CNAME ,內容爲你的域名,而後 cloudflare 簡單的配置一下
npm 的 organizations 能夠發佈一系列的包,咱們能夠在 npm 中找到它。
pkg 能夠方便的作到這一點,配合 yarn list 使用效果更佳 unpkg.com/packagename
analytics 是真的方便,誰用誰知道,能夠配合 umijs.org/plugins/plu… 一塊兒使用。
完整的流程能夠查看 procomponents.ant.design/