Adding Static Analysis tools

Abdullah Al Mamun Fahim - Oct 27 - - Dev Community

For this weeks lab, we are supposed to add Static Analysis tooling. So we are supposed to add source code formatter, linter, IDE integration, Pre-Commit hook and CONTRIBUTING.md.

For my source code formatter, I choose Pretter. It is very popular and I have seen it other projects but I never had to set it up from scratch so I wanted to do that. First thing I did was go to thier docs and followed their install instructions. I also updated the .prettierignore so that I could exclude the files and directories I don't want to be formatted. Then I ran

prettier --write .
Enter fullscreen mode Exit fullscreen mode

from the install docs. It worked so I added a npm script "prettier": "prettier --write ." so that I can run it easily in the command line. I reverted all the changes since a lot of the changes are not something I wanted in my project. So I went to options section to define my own format. Then I ran and committed the changes. Most of the changes were from enforcing single quotes and changing EOL from CRLF to LF.

For my linter I chose ESLint. Similar to Prettier I have never set it up. The docs for ESLint was kinda hard to follow. But similar to prettier I went to the docs then to the get started. Followed and ran the scripts to install it by running npm init @eslint/config@latest. After I ran

npx eslint .
Enter fullscreen mode Exit fullscreen mode

and it worked. There was no errors thankfully. I also added ignores object so that it doesn't run on node_modules and examples directory. And finally I added npm script so that I can run it easily in the command line.

For my pre-commit hook I choose husky. It was fairly simple. Since I had pre-defined scripts on my package.json it was just adding a single line npm run clean. I noticed it was running the lint and prettier on the entire code base on the entire codebase which didnt look okay. So I did some research and found lint-staged followed their instructions on installing it and then followed https://github.com/lint-staged/lint-staged?tab=readme-ov-file#packagejson-example to add my custom defined npm script and it was that simple.

My IDE of choice was VS Code. It uses extensions which I already had so I used the workspace docs to define my own.

I believe this is something that should be set up at the very beginning of the repo's life so that all the code-base is the same from the beginning and reduces chance of braking something with future implementation.

. . . . . . . . . . . . .
Terabox Video Player