Yeah really helpful. I was confused about whether the d.ts files are just for auto-generated type definitions and/or used to define types. Your suggestion to leave .d.ts files for auto-generation and .ts file for locally defined types has cleared the mist for me.
For a long time I was wondering what these *.d.ts files are and what these are used for. This video cleared all the doubts about it. Thanks from India for sharing.
This is really helpful! Well done and thank you :) It seems like .d.ts files are a parallel to interfaces in Java, since you export function definitions but not implementations. It might be interesting to see a .d.ts file used that way
No, interfaces are a part of typescript as well. I think d.ts files are mostly used for libraries made with Javascript, so typescript users have proper typing without the code base being written in typescript.
Thank you for this video ! I finally understand why I was struggling so much to install "Vue 2" libraries like vue-zoomer or vue-picture-swipe. They didn't support typescript apparently so they don't include the /type folder with the index.d.ts definitions either. If anyone else faced this issue I resolved it by adding a 'declare module 'vue-zoomer';' line to my 'shims-vue.d.ts' file and then I can follow instructions from the Github or official website for the library in order to add the components. What this does is treats the component as an 'any' type which still works fine (you just don't get the benefits of strongly typed javascript while using typescript).
Thanks for the video, and if you can make a video series covering tsconfig, project reference, and other topic regarding tsconfig as even the official docs aren't that easy to understand.
Thank you for amazing tutorials! Which extension do you use: "VSCode Neovim" or "Vim"? If first one, how did you manage to fix mouse selection? Thank you in advance!
Thanks Maksim! subcribed ^^ Im newbie to TS too & still strugling how to use the .d.ts file. Im really confused on some ponits: 1. When to use import/export & when to use ///
PLEASE, HELP. In our project we use Jest and want to integrate Cypress. When we started integrating Cypress - it started having conflicts with Jest's types, because some of the types between Jest and Cypress have the same names. But how it could happen, if each library should have its own path to d.ts file? It looks like the types for the whole application eventually are collected in one place? Or how it is possible?
Hi Marksim Ivanov, thanks for the video, i want to learn how to build an @types project from scratch. My objective is to export only the type definitions of my project A so i can install these types in another project B. Did you have any information/video about it? please let me know
What about the name of the d.ts files, for example, why someone will call it index.d.ts? and can I use the same name I have for the module, for example I have stack.ts, can I make a file called stack.d.ts and import it inside stack.ts ? and what is the /// thing
Would like to see how to handle Ambient Modules so i could avoid hard dependencies and thus some circular dependencies in some cases (i know that TSC handles circular dependencies, but in some cases they should be eliminated).
@@satansdeer1 I can give my recent example. Redux Ducks approach where you organize Redux into features and combine them into rootReducer and export RootState. But then you want to import same RootState into Selectors for example. Its a circular dependency. For example in Bazel it's not allowed because all module dependencies should be explicitly declared. You can't import from feature into root and then import root back into feature. So.. the way to handle this is Ambient Modules because all i need from the RootState is its type signature `const getState = (state: RootState) => state.something`. But i found it challenging to configure nested/extended tsconfig so that i would eliminate hard dependency on `import {RootState} from 'Types'` where Types is the ambient module injected in upstream tsconfig.compilerOptions.types field. I dont want to use `... from '../../../types'` because this is hard dependency. Hope this makes sense. As i said... TSC handles this easily and you dont need ambient modules and so most of devs are ok with their circular dependencies. But overall i think it's a antipatern anyway. I do not expect you to make a video on such rare usecase. Just listed my experience. Have a nice day! :)
A lot of people who are diving into TS are searching clear explanation of difference between global and namespace. What should you use? or how to make your types be available in the whole project
I'm I it's better to import export types instead of polluting the global namespace. I'll think about some example project to demonstrate how to use both though
this file allows you to configure the way your code is compiled and typechecked for example if it should allow you to use type any if you generate this file using tsc init - it will have comments explaining a bunch of fields there to learn about other settings you can use there check the documentation
Man, I have been looking for a channel like this for months!! Keep going!
Thanks man
Yeah really helpful. I was confused about whether the d.ts files are just for auto-generated type definitions and/or used to define types. Your suggestion to leave .d.ts files for auto-generation and .ts file for locally defined types has cleared the mist for me.
For a long time I was wondering what these *.d.ts files are and what these are used for.
This video cleared all the doubts about it.
Thanks from India for sharing.
Great content man, more typescript videos!
Thats precisely i was looking for. Thanks for a very short and clear video
Твои видео выходят быстрее, чем я успеваю развиваться. Спасибо большое за то, что делаешь фронтенд доступней)
Рад стараться)
You are plain awesome! The best explanation to understand types in TypeScript.
This is really helpful! Well done and thank you :)
It seems like .d.ts files are a parallel to interfaces in Java, since you export function definitions but not implementations. It might be interesting to see a .d.ts file used that way
No, interfaces are a part of typescript as well. I think d.ts files are mostly used for libraries made with Javascript, so typescript users have proper typing without the code base being written in typescript.
Много информативно, благодаря!
Thank you so much, this was very informative!
Thank you Maksim! Excellent explanation!
Extremely helpful, thanks! 😄
Thank you for this video ! I finally understand why I was struggling so much to install "Vue 2" libraries like vue-zoomer or vue-picture-swipe. They didn't support typescript apparently so they don't include the /type folder with the index.d.ts definitions either.
If anyone else faced this issue I resolved it by adding a 'declare module 'vue-zoomer';' line to my 'shims-vue.d.ts' file and then I can follow instructions from the Github or official website for the library in order to add the components. What this does is treats the component as an 'any' type which still works fine (you just don't get the benefits of strongly typed javascript while using typescript).
Great lesson! Thank you very much!
Very well explained and organized. Thank you
Thanks a lot, man!
Thanks for the explanation, I used files like that but I didn't know why.
Thank you so much for this!
Thanks for the video, and if you can make a video series covering tsconfig, project reference, and other topic regarding tsconfig as even the official docs aren't that easy to understand.
Awesome explaination .
Thank you for amazing tutorials!
Which extension do you use: "VSCode Neovim" or "Vim"? If first one, how did you manage to fix mouse selection? Thank you in advance!
Great explanations!
Hey Maksim, great channel.
As I know you don't need to export types from *.d.ts files. Types should be available w/o export/import.
perfect, short and informative
Nice video!
thanks for the video. it is well explained
Hej, Maksim Great channel and material. What shell plugin do You use for the terminal? zsh?
Great! Thanks
Great. very clear
Awesome
Very helpfull Sir. I have problem like this in my express-handlebars. Many thanks from Indonesia.
best expplanation out there
Really Good Content
Great video
Very helpful
Thanks this is quite helpful, as I'm learning
спасибо, отличное видео
Thanks for these explanations!
How do I generate d.ts files for an npm package that doesn't not have one ?
Thanks Maksim for this! How about "declare" when do we use it in the d.ts file?
also wondering about this...
I think declare is used when you want to use . notation. so if you want intelisense to show available chainable methods and variables.
Please make a video about the tsconfig file. Really like your videos keep up with your amazing work 👌
Thanks, will do for sure
It was really very helpful
Thanks Maksim! subcribed ^^
Im newbie to TS too & still strugling how to use the .d.ts file.
Im really confused on some ponits:
1. When to use import/export & when to use ///
thank you!
PLEASE, HELP. In our project we use Jest and want to integrate Cypress. When we started integrating Cypress - it started having conflicts with Jest's types, because some of the types between Jest and Cypress have the same names.
But how it could happen, if each library should have its own path to d.ts file?
It looks like the types for the whole application eventually are collected in one place? Or how it is possible?
Hi Marksim Ivanov, thanks for the video, i want to learn how to build an @types project from scratch. My objective is to export only the type definitions of my project A so i can install these types in another project B. Did you have any information/video about it? please let me know
How do I use my local d.ts file in angular 11 application? Do I have to follow the same process as it is shown in the video?
In react what's the difference between using interface or types? Is interface possibile to add in d.ts?
Спасибо большое!
Thanks for your share! Do you have blog text for this video?
Hi! Which theme do you use?
отдуши душевно в душу
Thank you 🙂 though I hoped you would touch on why types declared in the d.ts files aren't "export"ed, though seemingly auto imported?!
It needs to be added in `include` parameter of tsconfig.json and the interfaces and types will be available globally in your project.
What about the name of the d.ts files, for example, why someone will call it index.d.ts? and can I use the same name I have for the module, for example I have stack.ts, can I make a file called stack.d.ts and import it inside stack.ts ?
and what is the /// thing
can you tell me what is your vscode theme?
good!
Thanks a lot. Very useful. In the end you said join my Discord server. But I can't find it on you channel. No Discord icons I see on your banner.
What if I find one js library that does not include types ? And I don't want to manually write them up.. like "react-graph-vis"
did you find the solution to this?
@@bluepurplemoon5222 I ended up using react-d3-graph
Would like to see how to handle Ambient Modules so i could avoid hard dependencies and thus some circular dependencies in some cases (i know that TSC handles circular dependencies, but in some cases they should be eliminated).
tbh i rarely use them, can you guve me ab example where you have problems with them?
@@satansdeer1 I can give my recent example. Redux Ducks approach where you organize Redux into features and combine them into rootReducer and export RootState. But then you want to import same RootState into Selectors for example. Its a circular dependency. For example in Bazel it's not allowed because all module dependencies should be explicitly declared. You can't import from feature into root and then import root back into feature. So.. the way to handle this is Ambient Modules because all i need from the RootState is its type signature `const getState = (state: RootState) => state.something`. But i found it challenging to configure nested/extended tsconfig so that i would eliminate hard dependency on `import {RootState} from 'Types'` where Types is the ambient module injected in upstream tsconfig.compilerOptions.types field. I dont want to use `... from '../../../types'` because this is hard dependency. Hope this makes sense. As i said... TSC handles this easily and you dont need ambient modules and so most of devs are ok with their circular dependencies. But overall i think it's a antipatern anyway. I do not expect you to make a video on such rare usecase. Just listed my experience. Have a nice day! :)
thanks, I forgot what they were for
thx
A lot of people who are diving into TS are searching clear explanation of difference between global and namespace. What should you use? or how to make your types be available in the whole project
I'm I it's better to import export types instead of polluting the global namespace. I'll think about some example project to demonstrate how to use both though
@@satansdeer1 looking forward to it!
please let us know functionality of tsconfig file ? Love from India
this file allows you to configure the way your code is compiled and typechecked
for example if it should allow you to use type any
if you generate this file using tsc init - it will have comments explaining a bunch of fields there
to learn about other settings you can use there check the documentation
Спасибки
salvador dali!
I'm still stuck...
Please Make form submit API React+typescript please
Hey, what is submit API?
@@satansdeer1 oh sorry sir it was mistaked by keyboard
Хороший английский
а можно на русском тоже самое :D