This is the first week after coming back from the study week. And we have our Lab 7 in this week. Lab 7 is not about coding new stuff or contributing on other people's repository. Lab 7 is about formatting the code we have from the SSG or in layman's terms making it look better.
Main Extensions
There are two main extensions that I chose to use in Lab 7. First is prettier, which is an opinionated code formatter. Second is ESLint which is a static code analysis tool for identifying problematic patterns found in JavaScript code.
Process
The lab itself was simple, though it did take time. I started to watch the video that our professor provided. I learned how effective prettier and ESLint would be for any programmers. With prettier, it can help us keep a same formatting when we coding with a huge team project. With ESLint it would save us a lot of time since they are very good at finding those tiny mistakes.
Setting Up
I installed prettier first using:
npm install --save-dev --save-exact prettier
and created a .prettierignore to ignore files that don't need modification, and to run prettiere in the commandline type npx prettier --write .
I then installed ESLint using:
npm init @eslint/config
to run ESLint type in the command line npx eslint yourfile.js or yarn run eslint yourfile.js
My main issues were when I just finished downloading ESLint and use the command in the command-line. Some errors popped up but my program was working as intended. So I had to do some digging around and find out what those issues were. though I couldn't for one of the issues so I set it to ignore only that line. It took a while to fix all the issues that were brought up.
Another issue that arose was when I ran lint on a single file. Commit the issues and push them but forget to run prettier after all the ESLint modifications. Though this was easily fixed by committing a second time, with the modifications.
Integration
In VS Code there are multiple extensions that can be downloaded, two of which included ESLint and Prettier. One particular extension runs both of these being this app here
Thoughts
In a sense this lab is not exactly complicated when it comes to the steps. But it does get tricky depending on the code, due to the differences in everybody's. It's strict around the smaller issues and a single issue could take quite a bit of time to fix. Sometimes even a difference between a single quote or a double quote can be an issue.
Top comments (0)