Or maybe not, whatever fits your needs. Personally, I think that definitely not enough people are using TypeScript for their config files, or maybe not a lot of people know that you even can in the first place!
Luckily, we’re entering an era of many projects having their config files typechecked as a first-class option, for instance Vite supports it through three(!) different methods, Astro ships typechecked config files in all of its starters and most projects Anthony Fu has worked on have typechecked config files, himself being a proponent of typing your config files
However, not every project has caught up yet. Have you ever tried writing by hand an ESLint or Prettier config only to realize that you don’t know half of the settings (and their values) it can takes? Well, TypeScript can, and will, help you with that!
Unfortunately, most tools do not support just using a
.ts extension or using an helper method, so we’ll have to use JSDoc type annotations to achieve this
While this is unfortunate, luckily JSDoc annotations are just as easy to use.
And there you go, your ESLint config is now typechecked by TypeScript which also means that you now get suggestions and completions through your editor. It’s fun AND interactive!
Let’s do the same thing for Prettier.
Similarly to ESLint, first install the types definition for Prettier through
@types/prettier and then add the following to your
It’s that easy and the benefits are very clear immediately. Frankly, in my opinion it’s worth it for the completions alone, so convenient. Let’s do more.
Tailwind ships types directly and even support directly using TypeScript configs
Astro ships with typechecked config files in all of its starters, and similar to Vite, also has a helper method to make it even easier to use