I'm not sure what I did to trigger this prettier code formatting thing . all I know is I opened up vscode to keep working on the same project I've been working on for months and all of a sudden I'm getting error messages and highlights about my double quotes and spacing.
here is what I've tried.
first i stumbled across an answer to a similar question and looked for a file named .prettierrc
edited it and set everything to false .
When that didn't work i deleted the file all in all.
Still nothing changed.
Then tried looking for prettier settings based on another suggestion of go to file>preferences>settings and searching for prettier .that also didn't work, no search results related to prettier . I've been back and forth with this and tried other suggestions on disabling prettier but none seem to work .
here is what almost worked .adding the lines rules: { 'prettier/prettier': 0, },
to .eslintrc.js but it still lives some warnings of missing semi colon
among a few others.
also I don't believe in need to edit any of the files that were initially available to remove something that initially wasn't
Since writing the below, I discovered that it may be more economical to keep ESLint on with the following in settings.json
:
{
// ...
"eslint.enable": true,
"eslint.run": "onSave",
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"files.autoSave": "off",
// ...
}
Note that if your entire project is not already formatted with Prettier, I suggest doing so using npx prettier --write .
.
Quick Fix: Disable the ESLint extension in VSCode.
Explanation: These errors are generated by a lint tool, most likely ESLint.
It happens when you install both the eslint
package as well as the "ESLint" extension in VS Code. The package checks to make sure the code is formatted well and throws errors if it's not. The extension runs the package seamlessly and dresses your VS Code window with those errors (hence the red squiggly lines). Good news is, you can have eslint
package installed in your project without the extension. Prettier can still auto-format your code using the package without the extension.
Answer: If you have installed the ESLint extension, you can simply disable it, either by using the "eslint.enable": false
or by finding ESLint in the Extensions sidebar and disabling it.
This Stack Overflow question has many answers which guide you on the matter.
Note: Prettier is not a lint tool. It's a formatter.
Bonus Tip: Run npx prettier --write .
in your project to format all files according to your Prettier rules.