Using lodash with typescript and jspm

322 Views Asked by At

I am maybe doing something wrong but I cannot find what so any help would be greatly appreciated. I am Using typescript 2 + jspm. I think I tried all the possibilities inside the tsconfig using typeRoots and types (adding the version number in the name of the type). My current config is the following and it is not working whereas I think it should...

package.json

  "jspm": {
    "dependencies": {
      "lodash": "npm:lodash@^4.17.4"
    },
    "devDependencies": {
      "@types/lodash": "npm:@types/lodash@^4.14.45",
      "babel": "npm:babel-core@^5.8.24",
      "babel-runtime": "npm:babel-runtime@^5.8.24",
      "core-js": "npm:core-js@^1.1.4",
      "systemjs": "npm:systemjs@^0.19.41"
    }
  }

tsconfig.json

"typeRoots": [
  "jspm_packages/npm/@types"
]

Then compiler does not understand

import * as _ from "lodash"

I get

Cannot find module 'lodash'.

as suggested by the typescript doc https://www.typescriptlang.org/docs/handbook/declaration-files/consumption.html

Now if I remove the import, the funny thing is that vcode is able to go find the merge method definition (F12) if I write the following line of code

_.merge(a, b);

but compiler still complains that

Identifier '_' must be imported from a module

Any idea ? :)

1

There are 1 best solutions below

0
On

This is not really a solution but for now to avoid Typescript compiler complaining this is what I do

declare const _: any;

I just remove that line when I want completion for methods signature

Note that when I import lodash

 System.import('lodash').then((lodash) => {
     window._ = lodash;
 });