How to Fix ESLint Errors Upon Save in VS Code
Two of the most prominent utilities in web development today are ESLint and Microsoft's Visual Studio Code. I enjoy using both, and I love the integration between both tools, but warnings from ESLint inside Visual Studio Code aren't fulfilling -- I'd rather lint errors be fixed each time I save.
Complete the following steps to make Visual Studio Code fix any lint errors when a file is saved:
- Open the following file path:
~/Library/Application Support/Code/User/settings.json - Within the JSON structure, add the following:
{
// ... Existing JSON here ...
"editor.codeActionsOnSave": {
"source.fixAll": true
}
}
Every time you save applicable files within Visual Studio Code, ESLint will be run to fix any errors.
For me this is a massive time savings. There is some risk that this task might take a while one large files but for me it's worth it.
![Designing for Simplicity]()
Before we get started, it's worth me spending a brief moment introducing myself to you. My name is Mark (or @integralist if Twitter happens to be your communication tool of choice) and I currently work for BBC News in London England as a principal engineer/tech...
![Creating Scrolling Parallax Effects with CSS]()
Introduction
For quite a long time now websites with the so called "parallax" effect have been really popular.
In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...
![CSS Gradients]()
With CSS border-radius, I showed you how CSS can bridge the gap between design and development by adding rounded corners to elements. CSS gradients are another step in that direction. Now that CSS gradients are supported in Internet Explorer 8+, Firefox, Safari, and Chrome...
![Cross Browser CSS Box Shadows]()
Box shadows have been used on the web for quite a while, but they weren't created with CSS -- we needed to utilize some Photoshop game to create them. For someone with no design talent, a.k.a me, the need to use Photoshop sucked. Just because we...
This is going to save a lot of my time! Thanks a lot for this :)
It would better to save this in the project root under .vscode/settings.json to ensure the config is consistent across the whole team – otherwise it kinda defeats the point of having eslint.
https://github.com/olmesm/better-cypress-axe/blob/master/.vscode
Tnx for the info, was useful to read. I use Microsoft’s Visual Studio Code and I like how it works.