Scaffold an eslint Plugin with Yeoman

Matias Hernández: [0:00] The easiest way to create an ESLint plugin is by using a Yeoman generator. Let's first create folder to hold the blank code. cd into it and run generator. The generator will ask a few questions to scaffold the plugin.

[0:16] This is a plugin? What is your name? By convention, the plugin ID start by eslint-plugin, and we will end with the name. In this case, egghead. Write a short description. This have custom rules, and no processors.

[0:36] The generator will create a few files. The main entry file for your plugin is that index.js file available inside the lib folder. This is just a basic scaffold that import the code of all of the rules that belong to plugin that can be found inside the lib/rules folder.

[0:53] Now, it's time to start adding rules to the plugin. As an example, let's check the async suffix rule available inside the lib/rules folder. This is a basic rule with the minimal scaffold required by a rule. A rule is an export object composed by a meta object and a list that create method.

[1:13] In general words, this method is the one that apply your rule. It returns an object where every entry is named by an AST node type and is declared as a function. Each of these functions takes the current AST node preceded by eslint and apply the code described in there.

[1:32] In this case, it checks if the node is marked as async and it's naming all the required suffix. If it's not correct, the function uses the context object to trigger a report with an error message.

[1:46] We can see this working with the following demo code, this summarizing code with three example functions where one of them is with the wrong name. As you can see, by running eslint here, we can quickly check that our rule works.

[2:03] To recap, we need to create a folder to hold your code and use the ESLint Yeoman generator to scaffold the plug-in. Then, write your rules and use it in another project.