如何参与大型开源项目-Taro 共建

2022/02/24 18:30
阅读数 200

本文来自前端程序媛「清汤饺子」,饺子非常高产,点击文末「阅读原文」直达她的掘金主页

一、背景

在开发的工作中,我们都引用过大量的社区优秀的开源项目,但怎么才能更好的了解这些开源项目呢,答案是 Join it

参与开源项目,能够帮助我们拓宽对研发项目的认识,更好地理解开源项目的原理,以及提高个人影响力、竞争力。

二、选择项目

人对于不熟悉的东西总是觉得高深莫测的,没有参与开源项目的经验的时候,会对参与开源项目不知道从何下手。

其实不然,在我们开发日常需求时就可以参与到开源项目中来,开发时用到的技术栈,就是我们最值得入手的开源项目了。

像我自己日常有开发微信小程序、京东小程序等跨平台的需求,这类型需求主要技术栈是 Taro[1]Taro[2] 本身就是 github star 近 30 k 的优秀开源项目了,那么我就可以从 Taro 着手,参与到开源项目的建设工作中。

三、快速开始

首先要了解、遵守开源项目的贡献规范,一般可以在官网找到贡献规范文档,如 Taro 贡献指南[3]

1. 确定贡献形式

贡献形式多种多样,下面我以 “提交代码” 类型快速开始贡献流程。


2. 找到感兴趣的 issue

Taro 官网:issue 中会列出所有被标记为 Help Wanted 的 Issues,并且会被分为 Easy、 Medium、 Hard 三种难易程度。

通过 issue 标签筛选,选择自己感兴趣的 issue,可以先从 "Easy" 的开始:


在 issue 中 Assignees 至自己:


3. fork & clone

fork Taro 源码至自己仓库:


clone 个人仓库的 Taro 源码至本地:

git clone https://github.com/jiaozitang/taro

4. 本地开发环境

在 Taro 源码项目中安装依赖并编译:

# 安装依赖
$ yarn

# 编译
$ yarn build

查看该 issue 涉及哪些 package,为这些 package 设置 yarn link,并在本地编译,使得调试项目能够 link 到开发中的源码:

Taro package 说明见文档:Taro 仓库概览[4]

# yarn link
$ cd packages/taro-components
$ yarn link

# 本地编译
$ yarn dev

新建 Taro 项目用于调试 Taro 源码:

# 使用 npm 安装 CLI
$ npm install -g @tarojs/cli

# 初始化项目
$ taro init myApp

# yarn link
$ yarn link "@tarojs/components"

5. 开始开发

5.1 功能开发

通过以下步骤解决上述 “textarea 组件 onLineChange 时间调用无效”[5] issue:

源码路径:packages/taro-components/src/components/textarea/textarea.tsx

onLineChange 事件:

  • 新增 onLineChange 事件
  • 监听输入事件,输入时通过行高计算行数
  • 行数改变时触发 onLineChange

auto-height 属性:

  • 新增 auto-height 属性
  • 新增 auto-height 样式

具体代码见:https://github.com/NervJS/taro/pull/10681/files

5.2 更新测试用例

在测试用例中添加对 onLineChange 事件、aotu-height 属性的测试。

源码路径:packages/taro-components/__tests__/textarea.spec.js

5.3 更新文档

在 README 中更新对 onLineChange、auto-height 的描述。

源码地址:packages/taro-components/src/components/textarea/index.md

5.4 自测

在本地测试项目 myApp 中,自测 onLineChange 事件、auto-height 属性功能是否正常,自测通过后,在 Taro 源码项目中跑自动化测试。

# 自动化测试
$ npm run test

6. 提交 pull request

测试通过后,在 github 中提交 pull requrst。


7. code review 流程

提交 pull request 后等待社区 code review,并及时跟进 code review 反馈进行修改。


四、总结

本文讲述了参与大型开源项目-Taro 的流程,其中以为 Taro 解决 issue 的视角,介绍了从认领 issue、解决 issue、贡献代码的完整过程。

在这个过程中,我们可以了解到如何参与开源项目并帮助开源项目解决问题,在开发工作中遇到开源项目的问题时,就可以愉快地参与进来了,不用因为一个小问题耽搁项目进度。

星星之火,可以燎原,在越来越多的开发者的参与下,开源社区的发展未来可期。

参考资料

  • 如何参与一个顶级开源项目 [6]

参考资料

[1]

Taro: https://github.com/NervJS/taro

[2]

Taro: https://github.com/NervJS/taro

[3]

Taro 贡献指南: https://taro-docs.jd.com/taro/docs/CONTRIBUTING

[4]

Taro 仓库概览: https://taro-docs.jd.com/taro/docs/codebase-overview

[5]

“textarea 组件 onLineChange 时间调用无效”: https://github.com/NervJS/taro/issues/8003

[6]

如何参与一个顶级开源项目: https://juejin.cn/post/6844903918749614087


本文分享自微信公众号 - 凹凸实验室(AOTULabs)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部