Comment by Sébastien Portebois on "How does ES6/TypeScript import work?"

CommentHow does ES6/TypeScript import work?

Sébastien Portebois

Software architect at Ubisoft

Jun 21, 2016

Hi!

If you're writing it from Typescript, then you could (and should) skip the extension in your TS file, to get something either:

like import {Gauge, Donut, BaseDonut, TextRenderer} from './gauge';
or write import * as gauge from './gauge'; (in which case you then later need to use the exports from this module: gauge.Gauge, gauge.Donut, gauge.BaseDonut, gauge.TextRenderer

About the question, «why are the { } required», in fact the only case you don't need it is when your module has only one default export declaration.

To really get how it works, I would really recommend you to take 10-15 minutes and read the modules chapter of Typescript's Handbook, it would be really worth it! And if you're short in time, read the import part, and make sure to read the very short but so usefull 'red flags' part at the very end!

Emil Moe

Senior Data Engineer

Jun 21, 2016

Thank you. I will be reading that page when I have time. Would you recommend me researching TypeScript a bit in order to better understand Vue? I have no idea if those 2 are related, but you can see above how my Vue codes are.

Hi @emilmoe . To be honest, I only Vue from its name, have heard about it, but never used it (all my recent work is Node based, and was SDK focused previously... therefore my UI knowledge is probably way outdated and others are likely to be much more helpful.) After having a quick look at it, Vue seems to be plain JS so it might be a direct benefit to get into Typescript to learn it.

But Typescript modules and import are the same as ES6 javascript (ie plain but modern), so it's never a bad idea to stay up to date.
And when a good definition file is already available (which might or might not be the case for Vue.js), it's really helpful, because Typescript type declaration are also very helpful in a way to self-document the code, and you learn the API from the intellisense suggestions.

Search Hashnode