Recently I started working on a new web app project and we used TypeScript on both front-end and the server. TypeScript was a game changer just from the types.
We need static code analysis and code formatting to make the code readable, correct and <whatever>. Here is how I solved this in my code setup:
- Code analysis -> TypeScript compiler
- Code formatting -> Prettier
That's it. Using pre-commit hooks it made my life so easy that i don't even have to think about code formatting as its done for me and consistent across the board. All I have to think about is the actual code.
Question: Do I need ESlint/TSLint to check my code for non-style issues?
Because typescript compilers already does that for you.
I am just asking because I have not felt the need for it and I know everybody uses it. So i am thinking what am I missing?
Please share your thoughts :)
Top comments (6)
If you have a TypeScript project you should be using tslint. Choose your tslint config and then add the tslint prettier config as well. Here's a good article that talks about it.
You didn't mention it, but I'm curious what you use for pre-commit hooks. Are you using husky? If so, it works well with lint-staged.
You can run anything.
lint-stagedcompliments this package very well. Here's an example, github.com/nickytonline/generator-...Thats my basic question on why do I need
tslint? Typescript parser helps me detect all the code issues and prettier styles the code.Prettier formats the code and the TypeScript compiler type checks, but neither are linters. Prettier is linter-like in the sense, it does the linting formatting rules part. However, for example TS nor Prettier will enforce using
constor theno-consolelinting rules or how a variable is written, e.g. camelCase vs. PascalCase. This is why I'd recommend also using tslint.I agree. I Have not made up my mind yet, thats why I am trying to understand what people do in similar project setup. Then i can also follow the same path.
Update to this. I use eslint with TypeScript now. If you want to see my setup, check out
Source code for my web site iamdeveloper.com
iamdeveloper.com
Hey there, I'm Nick and this is my site's source code. This site started off as a clone of the Netlify CMS Gatsby Starter (check it out!). Since then, I've tweaked it a lot and converted the codebase to TypeScript.
Feel free to peruse the code and/or fork it.😉
Thanks to all the wonderful projects that made it possible to build this blog.
To get up and running:
git clone git@github.com:nickytonline/www.iamdeveloper.com.gitorgit clone https://github.com/nickytonline/www.iamdeveloper.com.gitnpm installnpm run developto get up and running with the Gatsby development server.npm run type-check:watchAlso, here's a great post from @robertcoopercode about TypeScript and ESLINT.
Using ESLint and Prettier in a TypeScript Project
Robert Cooper
Woot woot thanks for the shoutout.
@gyandeeps and I have been discussing whether using a linter is at all useful when combined with TypeScript. He doesn't seem convinced, haha.