Adding static analysis to my SSG
Neil An
Posted on November 1, 2022
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.
Posted on November 1, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 30, 2024
November 30, 2024