这里主要介绍如何快速参与开源项目的方式, 一般头次参与开源,都有畏难情绪,怕被拒绝,怕自己写的不规范。实际操作下来,社区还是挺包容的。
1.选开源项目
作为一名前端开发,可以参与的开源项目很多。
- 框架类:vue3, react ...
- 工具类:vue-router,pinia ...
- UI库:elementPlus, ant-design , Naive UI...
- 可视化:three.js, echart DataV ...
框架类如vue3这种门槛确实高,复杂度高,可视化对图像知识和算法有一定要求。
比较适合参与的如工具类或者平时用的UI库。
这里推荐elementPlus, ant-design ,毕竟天天用,比较清楚使用的方式,有利于快速了解源码。
2.选修改的内容
找简单的issue
一般开源项目都有很多issue,如可以在上面找一些如:pr welcome 这种标签,一般都是比较好改 问题描述比较清晰的

找错误的文字
第一次建议从纯文字的优化开始,如国际化配置的修改,因为这些不会涉及到具体的逻辑,基本是跑用例的时候也不会报错
3.利用ai找错别字并提交pr
elementPlus
首先fork一下 elementPlus的代码 具体操作参考 juejin.cn/post/693136...
这里最好的办法就是使用 trea工具, 打开trea,
问ai:帮我分析一下项目的所有国际化文字有没有错别字

上面回答说在这个路径element-plus/packages/locale/lang
选中文件夹再问ai:lang 帮我分析一下所有国际化文字有没有错别字




最后我们比较明确了国际化的中文是哪几个文件。
再问ai:zh-cn.ts zh-hk.ts zh-mo.ts zh-tw.ts 都帮我详细检查



上面已经帮我们总结好了哪里有错误,直接修改即可。由于只修改了国际化配置,你甚至连运行检查都不需要。
当然如果你怕直接提交pr被打回,可以提前发一个issue issue地址,把你发现的问题都写出来。


issue里面一五一十的把问题都描述出来,这时候维护的人就会给你的issue 打上
pr welcome
这时候,你再去提交pr 基本上稳稳地了。

注意 实际创建issue时,往往需要你必须按他的格式填写,由于我是只改了中文国际化,所以缺少很多信息,当你缺少信息的时候,会自动把issue变成 discusstion

这里有一堆信息必须填写。
但是奇怪的是我看很多issue都是没有按这个格式来的,后面才发现,原来大伙都是先随便填一些信息,发布后再整个内容替换。(当然非常不建议大家这么做,确实会加大社区人员定位问题和沟通的成本)
下面是提交的pr,把本地的dev提交到社区的dev上面。

我们还是遵循elementplus的提交规范 element-plus.org/zh-CN/guide...

注意:如果你提交的pr有关联的issue,需要在git内容里面 加上
closed #xxxx

这里我们加上了 closed #202360
来关闭上面的issue
ant-design
有了上面elementPlus的经验,再来操作ant-desgin就容易的多。一样的套路
选中国际化文件夹路径components/locale
问ai:帮我检查一下这个项目的国际化文件是否有bug

上面我们已经发现有可以优化的代码。
我们再针对性的问中文相关的3个国际化文件,进行更具体的提问。
问ai:检查 zh_CN.ts zh_HK.ts zh_TW.ts 三个文件是否所有key都一致

这里我们就不提交issue,直接提交pr
这是提交的pr github.com/ant-design/...
这里我们尽量按普片的git规范提交,下面勾选自己修改的内容,上面勾选的是
Internationalization
国际化配置,提交pr后,就等待,等一个个大佬review。
最后审核通过后,还会给你个二维码(这是可以打入阿里内部的一个很好的方式哈)

扫二维码后,进入审核群,审核群发自己的pr就会拉你进去真正的开发群。

真正开发群,每周三还有周会
在开源方面阿里确实走在前面,应该是有人专职的运维,而且定期会有红包答谢哪些贡献排前的朋友

在内部还有分数排行榜,来实时分析自己目前的权重排名,ztm专业。
4.如何成为contributors
代码被merge后就是就是contributor吗?
网页查询
网页版的contributors 查看只能显示commit 大于5的
在首页右边我们只看到少许的贡献者,点击标题进入详情

这里会显示1,3,6,12,24个月的贡献者
鼠标一直滚动都找不到自己的身影,没错这里只会显示提交较多,文件修改也多的人。

所以想榜首有名还得多贡献,多提交。
接口查询contributors
api.github.com/repos/{owne...?page=1&per_page=100
api.github.com/repos/element-plus/element-plus/contributors
git网页自己的提交记录
在git的搜索框 author:mjsong07 repo:element-plus/element-plus
author:mjsong07 repo:ant-design/ant-design

命令查询 提交记录
git log --author="username_or_email" git log --author="mjsong07"
5.总结
整体体验下来,ant-design社区比elementPlus要活跃点,当天提第二天就给你merge了。由于elementPlus工程化程度很高,所以门槛较ant-design要高。新手推荐从ant-design入手。 这里只是开个头,希望想参与开源的朋友都可以迈出自己扬名立万
的第一步 哈。