Version 2 brings several module enhancements which allow for a better workflow when working with typescript. It introduced global support, baseURL, path mapping and shorthand into the syntax.
- [Instructor] Version two brings several module enhancements, which allow for a better workflow when working with Typescript. It introduced global support, base URL, path mapping and shorthand into the syntax. Let's explore each one. So, the first thing I want to do is, just to make sure we don't get those errors again, either you comment it out or just remove the assignment of Atlantic to ocean, so we can be at peace with those type of errors that we could still get. So, I'll comment those out, and do another compile, just to make sure.
Save first before you compile, because otherwise, it's not going to compile the right file, there you go. Let's clear that out. Alright, so, keep that file open and we'll also open tsconfig.json, this is the file that we're going to do the module enhancements. So, the first thing you see here is sourceMap. So, if you were to compile with sourceMap, this is an option that basically creates a sourceMap for your Typescript, so if you debug in Chrome or any any other browser, it'll allow you to go back into it and see the code where it is specifically in your TS file with sourceMap, so that's an option.
So, the new things that are coming with 2.0 for modules is, one, the base URL, so if we add a base URL, for example, like so, and then we would do node_modules, for example, so we're including this particular directory into the base URL. So, that will allow us to import a jquery file without having to go through all the different directories, so instead of writing something like import, let me go into the right file to do that, just to kind of show you.
So, instead of doing import jquery from, instead of doing the full path, like so, so, node module blah blah blah and then jquery, you would do specifically just jquery, like so, and it would actually import without any issues. Right now, there's an issue, because we haven't saved our file yet. So, that's what it would allow us to do.
Okay, and then next thing that comes with the version 2.0 is the path. So, if, for example, you're trying to import something that is not a node module. So, most of the time, our dependencies are in node modules, but if you're importing something that's not in node modules, you can do specific paths. So, you could put your path, for example, for jquery, somewhere, so, for example if it's not in node modules and you're reporting it separately, you could actually specify where exactly that path is, like so.
So you could do something like, for example, okay so, jquery, for jquery you need to import the, in the distribution folder, the jquery.min.js for example. So if you want to specifically import that demidify version of jquery instead of, I don't know, the D, development one where you can see the code, you can do that and specify the path.
So this is the use of that, those particular enhancement in Typescript two. Here's another enhancement, from a module perspective. I spoke about the shorthand so, let me just put a title here because we'll comment that, otherwise we'll get errors down the road, so if you were let's say for example, this is the top of the file. So this, all this doesn't exist, and you start a new file where you actually create code that you want to have into another file.
So for example, you want to modularize that particular file you're working on. So for example, let's do, we're declaring a module called test module, then with that declaration, all the code that would be included in that file you can actually import it into another file. So for example, we could import test from, so if we had code that was related to a function called test inside of the test module, then you can import test from test module, like so.
So these are the enhancements that came with the module. And there's actually more stuff that comes with the enhancements that were introduced in Typescript 2.0, so take a look at the documentation to make sure that you can see all the nuances that were included, so just to give you an example, there's, well there's the ability to do umd or isomorphic modules which can be accessed with an import or global variable, so you can read more in the documentation on the website.
Okay, so just before we move on, let's make sure we comment that out, because this is going to be a problem if we don't. Save your file. Just do a last, a last compile just to make sure we're good. Alright. So in the next video we'll do a quick overview of the other new features in Typescript 2.0. Before we move on to the new features introduced in version 2.1. See ya in a bit!
- Updating a local environment
- IDEs with TypeScript support
- Assigning null or undefined types
- Using control flow analysis
- Using tagged union types
- Using read-only properties
- Using mapped types
- Using objects spread and rest
- Leveraging external helper libraries