Using Lodash in TypeScript with Typings and SystemJS

Interestingly, I did not get any duplicate identifier errors in the compiler after installing lodash via typings. I see from your typings directory that you have browser, main, browser.d.ts, and main.d.ts folders and files. When I installed, I simply got a modules folder and an index.d.ts file that includes a ref path to lodash's index.d.ts file.

I'm guessing this is due to an update to typings. I see that they have updated from version 1.0.5 all the way to 1.3.0 in just the last two weeks. Funny to think that this video series is less than two weeks old yet something referenced in the video is already not the same 😄

Interesting!

Incidentally, why did you (John) remove the main version & keep the browser version? If you're importing it es-module style, shouldn't you include the npm version & leave out browser version?

Why do you map the lodash to cdn when it's already installed into npm_modules? Isn't it supposed to be mapped to some files within npm_modules/lodash?

Yes, but I wanted to clearly mark the difference between installing definition files and mapping to source files. By mapping to a cdn, I was able to show how SystemJS would make the request to load the file even if it's a remote file.

How your production mapping looks (whether to your local node_modules then doing a build/bundle or through using other CDN resources) is a decision left to you.

I'm actually going to revisit this lesson and concept when TypeScript 2.0 final is released.

Couple notes: Typings directories have changed: https://github.com/typings/typings/blob/master/docs/faq.md#where-do-the-type-definitions-install

But also, TypeScript is going to allow you to install definition files from npm. Hopefully this will remove all the confusion: https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/

I'm getting a "Cannot find module 'lodash'" error when compiling. It is coming from the line: import * as _ from 'lodash'; Any idea why?

Funny, I'm getting the same issue. TypeScript is compiling fine, but SystemJS is complaining about finding lodash.

I realized that my syntax was off in the config for SystemJS. I had 'map' under 'packages', when it is supposed to be a sibling of 'packages' in the config. Not sure if you did the same thing or similar, but maybe that will help you.

instead of using typings

npm install --save @types/lodash

http://stackoverflow.com/questions/34660265/importing-lodash-into-angular2-typescript-application/35820239

So we have installed lodash locally and are now loading it from CDN... makes sense. :/

Yeah. Typings package is deprecated! You should use

yarn add @types/{needed_package_name}!

so much overhead....

It is not recommended to use non-primitive box-objects such as "String" as type. We should use "string". https://www.typescriptlang.org/docs/handbook/declaration-files/do-s-and-don-ts.html

After deploying a typescript project to the web, the TSC compiler can hang on instances with low ram or CPU, do not use a t2.micro even for a demo project. Second, the error in the logs are totally cryptic after compilation. I recommend using something like Flow instead of typescript, so you can use types when you need and decide to compile your code into a readable form for 1st release.. It is hard to track bugs when the compilation is cryptic.

I can't compile it if lodash is not installed. Got this message from tsc compiler

src/main.ts:3:20 - error TS2307: Cannot find module 'lodash'.