Have you mentioned PR for open source projects?

Have you mentioned PR for open source libraries or frameworks?

If not, then today's article will teach you how to PR for open source libraries.

Why do you need to raise PR for open source projects?

This matter has to start several years ago (2019), when I was tossing a virtual DOM toy (refer to the previous article: 🔗What is the virtual DOM? ), as a standard front-end project, build Tools, Lint tools, and code formatting are all essential.

For the build tool, I chose Rollup . I hope that Lint of the code can be automatically performed every time I build, so I introduced a plug-in Rollup rollup-plugin-eslint .

In the process of using this plug-in, and we found Webpack corresponding plug eslint-webpack-plugin there are some gaps. When I use Webpack of eslint-webpack-plugin , I only need to configure the fix attribute to automatically fix the code when saving the code.

// webpack.config.js
const ESLintPlugin = require('eslint-webpack-plugin');

module.exports = {
  // ...
  plugins: [
    new ESLintPlugin({
      fix: true,
      extensions: ['js', 'jsx']
    })
};

When using rollup-plugin-eslint , looking at the document, it seems that this option is not mentioned, which means that rollup-plugin-eslint does not support this function at all. Then, I searched Issues. It doesn't matter if I didn't search. I was surprised and found that someone raised this question .

The author's response is also very simple, welcome to submit a PR.

I thought to myself that it must be difficult for no one to implement this feature for so long. But the eslint-webpack-plugin next door clearly supports this function, so I can just see how it can be implemented 🐶.

So, I eslint-webpack-plugin the code of 06111d6a1eefe9 and searched, and found that it used three lines of code achieve this function.

if (options.fix) {
  await ESLint.outputFixes(results);
}

Excited and trembling hands, I hurried to rollup-plugin-eslint to mention a PR .

🔗PR: https://github.com/TrySound/rollup-plugin-eslint/pull/27

The point is that the author never thought that this thing could be realized in such a simple way.

How to raise a PR on GitHub?

The above is the mental journey of my first PR mention. If you also find out what open source framework you are using now needs to be optimized, here is how to submit a PR on GitHub.

Fork open source projects

First fork the project you want to submit PR to your own warehouse.

Then go to your own warehouse and clone the Fork project to the local.

$ git clone [e-mail]:Shenfq/rollup-plugin-eslint.git

Switch to a new branch, commit changes, and push to the remote

After the code is cloned locally, switch to a new branch first, and the branch name is best to closely follow the content of this update.

$ git checkout -b feature/add-fix-option

Modify the code in the new branch:

+  if (options.fix && report) {
+    CLIEngine.outputFixes(report);
+  }

Submit changes:

$ git add .
$ git commit -m "feat: add options.fix"

Finally push the new branch to the remote:

$ git push --set-upstream origin feature/add-fix-option

New PR

Find the corresponding project in your GitHub repository, open the Pull requests Tab, click the New pull request button, and create a new PR.

Then, in the interface below, select the branch you just submitted, and finally click Create pull request .

After clicking, you will submit a PR that belongs to you in the corresponding project. If it goes well, you can "mix" the title of a contributor to an open source project.