你給開(kāi)源項(xiàng)目提過(guò) PR 嗎？
你有給開(kāi)源的庫(kù)或者框架提過(guò) PR 嗎?
如果沒(méi)有，那么今天的文章會(huì)教你怎么給開(kāi)源庫(kù)提 PR。
為什么要給開(kāi)源項(xiàng)目提 PR?
這件事還得從好幾年前(2019年)說(shuō)起，那時(shí)候在折騰一個(gè)虛擬 DOM 的玩具(參考之前的文章：🔗虛擬DOM到底是什么?)，作為一個(gè)標(biāo)準(zhǔn)的前端工程，構(gòu)建工具、Lint 工具、代碼格式化都是必不可少的。
在構(gòu)建工具上我選擇了 Rollup，希望每次構(gòu)建的時(shí)候都能自動(dòng)進(jìn)行代碼的 Lint，所以引入了 Rollup 的一個(gè)插件：rollup-plugin-eslint。
在使用這個(gè)插件的過(guò)程中，發(fā)現(xiàn)和 Webpack 對(duì)應(yīng)的插件 eslint-webpack-plugin 還是有一些差距的。我在使用 Webpack 的 eslint-webpack-plugin 時(shí)候，只需要配置 fix 屬性，就能夠在保存代碼的時(shí)候，自動(dòng)對(duì)代碼進(jìn)行 fix。
- // webpack.config.js
- const ESLintPlugin = require('eslint-webpack-plugin');
- module.exports = {
- // ...
- plugins: [
- new ESLintPlugin({
- fix: true,
- extensions: ['js', 'jsx']
- })
- };
而在使用 rollup-plugin-eslint 的時(shí)候，看文檔上，好像沒(méi)有提到這個(gè)選項(xiàng)，也就是說(shuō) rollup-plugin-eslint 根本不支持這個(gè)功能。然后，搜索了一下 Issues，不搜不要緊，一搜嚇一跳，發(fā)現(xiàn)有人在 2016 年就提出了這個(gè)疑問(wèn)😳。
作者的回復(fù)也很簡(jiǎn)單，歡迎提交 PR。
我當(dāng)時(shí)心想，這個(gè)功能這么久了都沒(méi)人實(shí)現(xiàn)想必很難吧。但是隔壁的 eslint-webpack-plugin 明明支持這個(gè)功能，我去看看它怎么實(shí)現(xiàn)的不就行了🐶。
于是，我就把 eslint-webpack-plugin 的代碼 clone 下來(lái)一頓搜索，發(fā)現(xiàn)它實(shí)現(xiàn)這個(gè)功能就用了三行代碼。
- if (options.fix) {
- await ESLint.outputFixes(results);
- }
激動(dòng)的心，顫抖的手，我趕忙就去 rollup-plugin-eslint 那里提了個(gè) PR。
- 🔗PR: https://github.com/TrySound/rollup-plugin-eslint/pull/27
關(guān)鍵是，作者都沒(méi)想到這個(gè)東西居然這么簡(jiǎn)單就實(shí)現(xiàn)了。
如何在 GitHub 上提 PR?
上面是我第一次提 PR 的一個(gè)心路歷程，如果你也發(fā)現(xiàn)了你現(xiàn)在使用的什么開(kāi)源框架有待優(yōu)化的地方，這里再教大家怎么在 GitHub 上提交一個(gè) PR。
對(duì)開(kāi)源項(xiàng)目進(jìn)行 Fork
首先把你要提交 PR 的項(xiàng)目 Fork 到自己的倉(cāng)庫(kù)。
然后到自己的倉(cāng)庫(kù)中，將 Fork 的項(xiàng)目 clone 到本地。
- $ git clone git@github.com:Shenfq/rollup-plugin-eslint.git
切換到新分支，提交變更，推送到遠(yuǎn)程
代碼 clone 到本地之后，先切換一個(gè)新的分支，分支名最好緊貼這次更新的內(nèi)容。
- $ git checkout -b feature/add-fix-option
在新分支修改代碼：
- + if (options.fix && report) {
- + CLIEngine.outputFixes(report);
- + }
提交變更：
- $ git add .
- $ git commit -m "feat: add options.fix"
最后將新的分支推送到遠(yuǎn)程：
- $ git push --set-upstream origin feature/add-fix-option
新建 PR
在自己的 GitHub 倉(cāng)庫(kù)中找到對(duì)應(yīng)項(xiàng)目，打開(kāi) Pull requests Tab，點(diǎn)擊 New pull request 按鈕，新建一個(gè) PR。
然后，在下面的界面中，選擇剛剛提交的分支，最后點(diǎn)擊 Create pull request 即可。
點(diǎn)擊之后，就在對(duì)應(yīng)的項(xiàng)目中提交了一個(gè)屬于你的 PR 了。如果順利的話，你就能『混』 到一個(gè)開(kāi)源項(xiàng)目貢獻(xiàn)者的頭銜。
