Hi everyone,
This week I added some static analysis tools to my SSG. The tools I added are Prettier and ESLint. Prettier is a code formatter to make code consistent and ESLint checks your code for any common errors/warnings.
It was easy to set both tools up. Since I was using nodejs, all I had to do was install the tools using npm. For Prettier, I used:
npm install --save-dev --save-exact prettier
and for ESLint I used:
npm init @eslint/config
Prettier changed a lot of stuff in my code. I usually put curly braces after a function or control statement like this:
if (...)
{
}
but Prettier changed to format to this:
if (...) {
}
Prettier also changed my indentation spacing and made everything look more compact.
For ESLint, it found a bunch of errors/warnings in my code. For example, a common warning was that I had unused variables in my code. There was also a warning telling me not to use async in a promise object.
To get the tools to run in the command line, I edited the package.json file and added some scripts to run Prettier and ESLint. Here is what I added:
"lint": "npx eslint src",
"prettier": "npx prettier --write .",
"prettier-check": "npx prettier --check ."
To integrate these tools into my IDE (VSCode), I just added the Prettier and ESLint extensions. For people contributing to my project, I added a .vscode/extensions.json file so that these extensions would be recommended to them on opening the project.
Overall, I learned a lot about formatters and linters and why they are important when working in a shared repo.
Top comments (0)