Typescript lodash no default export for one function

Question

I am trying to import only one function from lodash like this:

import get from 'lodash/get';

I already installed lodash and @types/lodash, and I'm getting this error:

@types/lodash/get/index"' has no default export.)

Solution 1

You can import a single function from lodash using import isEqual from 'lodash/isEqual'; in typescript with the esModuleInterop flag in the compiler options (tsconfig.json)

example

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "lib": ["es6", "dom"],
    "moduleResolution": "node",
    "esModuleInterop": true,
    ...
  }
}

Solution 2

i had same problem, and i ended up here,

so here is the solution:

you need to install lodash-es

npm install --save lodash-es

instead of normal lodash

and read this link

https://medium.com/@armno/til-importing-lodash-into-angular-the-better-way-aacbeaa40473

update 1: it should really be easier, but anyway

point 1: install typings

 npm i -D @types/lodash-es

point 2: import from "lodash-es" not "lodash"

point 3: import like this, it's proper way (otherwise you will get a much larger bundle)

import  orderBy  from 'lodash-es/orderBy';

Solution 3

This is what I had to do to make it working for lodash.random, which I think should reasonably work for lodash.get too :

• Install the function of lodash you want with npm install --save lodash.random
• Install the types linked to it: npm install --save-dev @types/lodash.random
• Set compilerOptions.allowSyntheticDefaultImports to true in your tsconfig.json
• Import it like import { random } from 'lodash';

Solution 4

I managed to get this working for a similar error by using:

import * as get from 'lodash.get';

Solution 5

Only way I could solve this was like:

import get = require("lodash.get");

See a similar example here: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/14160

The other suggestion, import * as get from 'lodash.get'; fails like this if you don't have the proper configuration: TS2497: This module can only be referenced with ECMAScript imports/exports by turning on the 'esModuleInterop' flag and referencing its default export

And actually, I have this in my tsconfig.json:

"allowSyntheticDefaultImports": true,
"esModuleInterop": true

And it fails anyway (not for React ,moment and other packages, but only for this lodash.get package). So, the ugly require do the trick (I mean ugly just because it breaks the ES6 import syntax, meaning we miss the code consistency).

View more solutions

Comments

[Dan Homola]

You need to set "allowSyntheticDefaultImports": true, in your tsconfig.json

[Bogdan Slovyagin]

No, it won't work. Only if "allowSyntheticDefaultImports": true is set in tsconfig

[MrHen]

Fixed the second example, sorry.

[mayid]

For me, it says: TS2497: This module can only be referenced with ECMAScript imports/exports by turning on the 'esModuleInterop' flag and referencing its default export.