资讯专栏INFORMATION COLUMN

打造个人or团队适用的开源项目规范

huangjinnan / 2151人阅读

摘要:打造个人团队适用的开源项目规范是一个用来优化托管在上的多代码库的工作流的一个管理工具可以让你在主项目下管理多个子项目,从而解决了多个包互相依赖,且发布时需要手动维护多个包的问题。

打造个人or团队适用的开源项目规范 lerna

Lerna 是一个用来优化托管在gitnpm上的多package代码库的工作流的一个管理工具,可以让你在主项目下管理多个子项目,从而解决了多个包互相依赖,且发布时需要手动维护多个包的问题。

lerna的文件树:

</>复制代码

  1. my-lerna-repo/
  2. package.json
  3. packages/
  4. package-1/
  5. package.json
  6. package-2/
  7. package.json

首先作为项目拥有者全局安装:

</>复制代码

  1. $ npm install -g lerna
  2. # or
  3. $ yarn global add lerna
init

在项目使用以下命令:

</>复制代码

  1. $ lerna init
  2. # or
  3. $ lerna init --independent

这条命令要注意的是,lerna提供两类管理项目的模式:

fixed/locked mode(default)

Fixed模式下,项目通过单一的版本进行控制。版本号放在项目根目录下的lerna.json文件的version这个字段。当你执行 lerna publish,如果有文件更新,它将发布新的版本。

independent mode(—independent)

这种模式下,项目里的各个package独立维护自己的version,它将会忽略lerna.json中定义的version

publish

</>复制代码

  1. $ lerna publish

Publish它做了以下几件事情

发布项目里的每个模块

执行lerna updated确定是否需要发布

假如需要发布 给lerna.json 版本号做自增

更新package.json里的版本号至最新

为新版本更新dependencies

为新版本创建一个git commit 和tag

发布更新项目到npm

一次发布所有packages

只有你在package.json里设置private: true这个包则不会被发布。

配置

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

</>复制代码

  1. {
  2. ...
  3. "npmClient": "yarn"
  4. ...
  5. }
代码检查和规范

在一个项目中,多人开发时会遇到代码格式问题。
解决方案:

使用Eslint

项目拥有者需要全局安装:

</>复制代码

  1. $ npm install eslint -g
  2. # or
  3. $ yarn global add eslint

在项目中执行命令:

</>复制代码

  1. $ eslint --init

React项目推荐使用airbnb规范。

</>复制代码

  1. {
  2. "devDependencies": {
  3. "eslint": "^4.19.1",
  4. "eslint-config-airbnb": "^17.0.0",
  5. "eslint-plugin-import": "^2.13.0",
  6. "eslint-plugin-react": "^7.10.0",
  7. "eslint-plugin-jsx-a11y": "^6.1.1"
  8. }
  9. }
使用Standard

参考中文文档 standard/README-zhcn.md at master · standard/standard · GitHub

Prettier

Eslint + prettier 解决了代码风格和格式化的所有问题。

与git hook来解决何时lint

目前比较成熟的是huskylint-staged两者结合:

</>复制代码

  1. $ npm install lint-staged husky -D
  2. # or
  3. $ yarn add lint-staged husky -D

接着在package.json中加入:

</>复制代码

  1. "lint-staged": {
  2. "packages/*/src/**/*.js": [
  3. "eslint --fix",
  4. "prettier --write",
  5. "git add"
  6. ]
  7. },
  8. "husky": {
  9. "hooks": {
  10. "pre-commit": "lint-staged"
  11. }
  12. },
Tslint

如果你的项目使TypeScript那么tslint能帮助你许多!

</>复制代码

  1. $ yarn add -D prettier tslint-config-prettier tslint-plugin-prettier husky pretty-quick
Tslint.json

</>复制代码

  1. {
  2. "defaultSeverity": "error",
  3. "extends": [
  4. "tslint:latest",
  5. "tslint-react",
  6. "tslint-config-prettier"
  7. ],
  8. "jsRules": {},
  9. "rules": {
  10. "prettier": [true, "./.prettierrc"],
  11. "ordered-imports": false,
  12. "object-literal-sort-keys": false
  13. },
  14. "rulesDirectory": [
  15. "tslint-plugin-prettier"
  16. ]
  17. }
编辑器的不同

解决方案:
主流的都是使用EditorConfig
只需要在根目录新建一个.editorconfig文件,然后去根据文档自行定义。再给自己使用的编辑器安装editorConfig的插件即可。
官方网站:EditorConfig

commit 不统一

主流的方法是commitizen.
项目拥有者应当全局安装:

</>复制代码

  1. $ npm install -g commitizen
  2. # or
  3. $ yarn global add commitizen

之后我们在项目里选用angular格式的commit message并在终端下输入以下命令:

</>复制代码

  1. $ commitizen init cz-conventional-changelog —save-exact
  2. # or
  3. $ commitizen init cz-conventional-changelog --yarn --dev --exact

上面的命令为你做了三件事:

安装cz-conventional-changelog的adapter的npm模块。

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

将config.commitizen键添加到package.json的根目录,如下所示:

</>复制代码

  1. "config": {
  2. "commitizen": {
  3. "path": "cz-conventional-changelog"
  4. }
  5. }

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

</>复制代码

  1. "scripts": {
  2. "commit": "git-cz"
  3. }

注意:
如果你使用像husky这样的precommit hooks,你需要为脚本命名除“commit”之外的其他东西(例如“cm”:“git-cz”)。
原因是因为npm-scripts有一个“feature”,它自动运行名称为prexxx的脚本,其中xxx是另一个脚本的名称。
本质上,如果您将脚本命名为“commit”,则npm和husky将运行两次“precommit”脚本,并且解决方法是阻止npm触发的precommit脚本。

之后如果有别人也参与进你的项目开发中,我们最好在仓库里也安装依赖

</>复制代码

  1. $ npm install -D commitizen
  2. # or
  3. $ yarn add commititzen -D
changelog

通过手动去维护changelog在我之前的那个wx-tsApi项目中是非常头疼的一件事情,所以去寻找自动化的东西。

全局安装

</>复制代码

  1. $ npm install -g conventional-changelog-cli
  2. # or
  3. $ yarn global add conventional-changelog-cli

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

</>复制代码

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

官方推荐的工作流程:

做出改变

提交这些改变

确定Travis变成绿色

改version

changelog

commit package.json 和CHANGELOG.md文件

打Tag

push

基于lerna的工作流程(自己研究的有不对请指出):

做出改变

git-cz

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

commit CHANGELOG.md 文件

Git push

lerna publish

借鉴

eJayYoung(如何打造规范的开源项目)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103714.html

相关文章

  • 打造 10000 Star 前端开源项目

    在工作学习之余,你可能会萌生做一个开源项目的想法。一方面将自己的好代码分享出去帮助更多开发者,另一方面也希望在开源社区中得到反馈和成长。如果项目能获得很多的关注那更是锦上添花,高 Star 不仅是衡量开源项目可靠程度的一个重要依据,这样项目维护者的 Github 也能在招聘中让公司提前了解候选人的开源贡献、技术热情和编程习惯等,获得面试官的加分。 那么,开源项目怎么才能获得更多的 Star 数呢?...

    QLQ 评论0 收藏0
  • “爱装X”开源组织:“教科书级”AI知识树究竟长什么样?

    摘要:开源社区的成员将人工智能入门疏解的每本书的章节拆开,再按照知识点合并,手动整理了人工智能知识树。目前主要负责新闻资讯相关,以及配合组织内各大佬的工作。作为一个开源组织,你们目前需要什么来自外界的帮助期待公益基金赞助万元年。 showImg(https://segmentfault.com/img/remote/1460000019363357); 作者 | Just 出品 | AI...

    nicercode 评论0 收藏0
  • 资源集 - 收藏集 - 掘金

    摘要:行爬取顶点全网任意小说掘金之前连续多篇文章介绍客户端爬取平台,今天我们从零开始,实现爬取顶点小说网任意一本小说的功能。文件标记所有文件我的后端书架后端掘金我的后端书架月前本书架主要针对后端开发与架构。 30行js爬取顶点全网任意小说 - 掘金之前连续多篇文章介绍客户端爬取平台(dspider),今天我们从零开始,实现爬取顶点小说网任意一本小说的功能。 如果你还不知道客户端爬取,可以先看...

    stdying 评论0 收藏0
  • 资源集 - 收藏集 - 掘金

    摘要:行爬取顶点全网任意小说掘金之前连续多篇文章介绍客户端爬取平台,今天我们从零开始,实现爬取顶点小说网任意一本小说的功能。文件标记所有文件我的后端书架后端掘金我的后端书架月前本书架主要针对后端开发与架构。 30行js爬取顶点全网任意小说 - 掘金之前连续多篇文章介绍客户端爬取平台(dspider),今天我们从零开始,实现爬取顶点小说网任意一本小说的功能。 如果你还不知道客户端爬取,可以先看...

    马忠志 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<