NOTE: For more up-t0-date and exhaustive explaination about how to maintain code consistency and quality, in your app, see this blog post.
Recently, the TypeScript team announced the new typescript-eslint
project. Meaning, you can start using the new @typescript-eslint/parser
parser.
Since I'm pretty new to TypeScript, I struggled getting it setup to work properly with Prettier. Fortunately, Ben Weiser wrote a great article on getting Create React App setup properly with the new parser.
I was able to take his suggestions and apply it to a vanilla TypeScript project.
Here is my setup:
Unlike Ben, I could not get my Prettier/VScode to work properly with the Prettier rules inside .eslintrc.json
.
"rules": {
"prettier/prettier": ["error", { "singleQuote": true }]
},
Instead, I had to put them in a separate .pretter.rc
file like:
{
"singleQuote": false,
"semi": true,
"tabWidth": 2,
"trailingComma": "all"
}
Now, Code is automatically fixing formatting issues on the fly and pointing out typing errors!
Let me know if you have any other suggestions for this. @Calendee