摘要：打造個(gè)人團(tuán)隊(duì)適用的開(kāi)源項(xiàng)目規(guī)范是一個(gè)用來(lái)優(yōu)化托管在上的多代碼庫(kù)的工作流的一個(gè)管理工具可以讓你在主項(xiàng)目下管理多個(gè)子項(xiàng)目，從而解決了多個(gè)包互相依賴，且發(fā)布時(shí)需要手動(dòng)維護(hù)多個(gè)包的問(wèn)題。

Lerna 是一個(gè)用來(lái)優(yōu)化托管在gitnpm上的多package代碼庫(kù)的工作流的一個(gè)管理工具,可以讓你在主項(xiàng)目下管理多個(gè)子項(xiàng)目，從而解決了多個(gè)包互相依賴，且發(fā)布時(shí)需要手動(dòng)維護(hù)多個(gè)包的問(wèn)題。

lerna的文件樹：

my-lerna-repo/
  package.json
  packages/
    package-1/
      package.json
    package-2/
      package.json

首先作為項(xiàng)目擁有者全局安裝：

$ npm install -g lerna
# or
$ yarn global add lerna

在項(xiàng)目使用以下命令：

$ lerna init
# or
$ lerna init --independent

這條命令要注意的是，lerna提供兩類管理項(xiàng)目的模式：

fixed/locked mode（default）

Fixed模式下，項(xiàng)目通過(guò)單一的版本進(jìn)行控制。版本號(hào)放在項(xiàng)目根目錄下的lerna.json文件的version這個(gè)字段。當(dāng)你執(zhí)行 lerna publish，如果有文件更新，它將發(fā)布新的版本。

independent mode（—independent）

這種模式下，項(xiàng)目里的各個(gè)package獨(dú)立維護(hù)自己的version，它將會(huì)忽略lerna.json中定義的version

$ lerna publish

Publish它做了以下幾件事情

發(fā)布項(xiàng)目里的每個(gè)模塊

執(zhí)行l(wèi)erna updated確定是否需要發(fā)布

假如需要發(fā)布 給lerna.json 版本號(hào)做自增

更新package.json里的版本號(hào)至最新

為新版本更新dependencies

為新版本創(chuàng)建一個(gè)git commit 和tag

發(fā)布更新項(xiàng)目到npm

一次發(fā)布所有packages

只有你在package.json里設(shè)置private: true這個(gè)包則不會(huì)被發(fā)布。

如果我們使用yarn我們可以在lerna.json做如下配置：

{
...
  "npmClient": "yarn"
...
}

在一個(gè)項(xiàng)目中，多人開(kāi)發(fā)時(shí)會(huì)遇到代碼格式問(wèn)題。
解決方案：

項(xiàng)目擁有者需要全局安裝：

$ npm install eslint -g
# or
$ yarn global add eslint

在項(xiàng)目中執(zhí)行命令：

$ eslint --init

React項(xiàng)目推薦使用airbnb規(guī)范。

{
    "devDependencies": {
        "eslint": "^4.19.1",
        "eslint-config-airbnb": "^17.0.0",
        "eslint-plugin-import": "^2.13.0",
        "eslint-plugin-react": "^7.10.0",
        "eslint-plugin-jsx-a11y": "^6.1.1"
    }
}

參考中文文檔 standard/README-zhcn.md at master · standard/standard · GitHub

Eslint + prettier 解決了代碼風(fēng)格和格式化的所有問(wèn)題。

目前比較成熟的是husky與lint-staged兩者結(jié)合:

$ npm install lint-staged husky -D
# or
$ yarn add lint-staged husky -D

接著在package.json中加入：

"lint-staged": {
    "packages/*/src/**/*.js": [
      "eslint --fix",
      "prettier --write",
      "git add"
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },

如果你的項(xiàng)目使TypeScript那么tslint能幫助你許多！

$ yarn add -D prettier tslint-config-prettier tslint-plugin-prettier husky pretty-quick

{
    "defaultSeverity": "error",
    "extends": [
                "tslint:latest",
                "tslint-react",
                "tslint-config-prettier"
    ],
    "jsRules": {},
    "rules": {
            "prettier": [true, "./.prettierrc"],
            "ordered-imports": false,
            "object-literal-sort-keys": false
        },
    "rulesDirectory": [
            "tslint-plugin-prettier"
        ]
}

解決方案：
主流的都是使用EditorConfig
只需要在根目錄新建一個(gè).editorconfig文件，然后去根據(jù)文檔自行定義。再給自己使用的編輯器安裝editorConfig的插件即可。
官方網(wǎng)站：EditorConfig

主流的方法是commitizen.
項(xiàng)目擁有者應(yīng)當(dāng)全局安裝：

$ npm install -g commitizen
# or
$ yarn global add commitizen

之后我們?cè)陧?xiàng)目里選用angular格式的commit message并在終端下輸入以下命令：

$ commitizen init cz-conventional-changelog —save-exact
# or
$ commitizen init cz-conventional-changelog --yarn --dev --exact

上面的命令為你做了三件事：

安裝cz-conventional-changelog的adapter的npm模塊。

將其保存到package.json的dependencies或devDependencies。

將config.commitizen鍵添加到package.json的根目錄，如下所示：

"config": {
    "commitizen": {
      "path": "cz-conventional-changelog"
    }
  }

然后在package.json里的scripts里加上

"scripts": {
    "commit": "git-cz"
 }

注意：
如果你使用像husky這樣的precommit hooks，你需要為腳本命名除“commit”之外的其他東西（例如“cm”：“git-cz”）。
原因是因?yàn)閚pm-scripts有一個(gè)“feature”，它自動(dòng)運(yùn)行名稱為prexxx的腳本，其中xxx是另一個(gè)腳本的名稱。
本質(zhì)上，如果您將腳本命名為“commit”，則npm和husky將運(yùn)行兩次“precommit”腳本，并且解決方法是阻止npm觸發(fā)的precommit腳本。

之后如果有別人也參與進(jìn)你的項(xiàng)目開(kāi)發(fā)中，我們最好在倉(cāng)庫(kù)里也安裝依賴

$ npm install -D commitizen
# or
$ yarn add commititzen -D

通過(guò)手動(dòng)去維護(hù)changelog在我之前的那個(gè)wx-tsApi項(xiàng)目中是非常頭疼的一件事情，所以去尋找自動(dòng)化的東西。

全局安裝

$ npm install -g conventional-changelog-cli
# or
$ yarn global add conventional-changelog-cli

然后在package.json文件中添加scripts

{
    "scripts": {
    "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md"
    }
}

官方推薦的工作流程：

做出改變

提交這些改變

確定Travis變成綠色

改version

changelog

commit package.json 和CHANGELOG.md文件

打Tag

push

基于lerna的工作流程(自己研究的有不對(duì)請(qǐng)指出)：

做出改變

git-cz

"conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md"

commit CHANGELOG.md 文件

Git push

lerna publish

eJayYoung(如何打造規(guī)范的開(kāi)源項(xiàng)目)