what's up typescript enthusiasts 👋
tired from writing types for your env variables to get a type-safe version of process.env as seen in this tutorial?
Setup
1- Install @types/node in your project
$ yarn add @types/node -D
// or using npm
$ npm i @types/node -D
2- First of all, download the VSC extension TS Env Typings
3- Specify env-typings.json file in the root of your project.
4- Add path field to your development .env file
and yep! you even have auto-completion in this JSON config too 😎
That's it, Enjoy!
Cool Features 🆒
1- Specify path for the generated output using output field in the JSON config.
2- Auto detect env variable type so that It can give you a nice example in the intellisense on how to use and parse it.
so as an example if you've a number env variable It'll tell you to use parseInt to parse it before using it cause env variables are always read as strings.
3- Variants for an env variable, so you tell the extension what are the possible values for an env variable so It can generate better types for it and recommend you a nicer example to use
How to specify Variants in .env file?
add a comment at the end of the env line that includes "# variants:"
specify the different variants for your variable seperated by a "|" like you would in typscript
quotes are optional around the variants values
That's it.
If you liked the extension, please give it a star here 🌟
Hope you've a great day, curios to see your feedback 🤗
Top comments (0)