How to re-export an individual lodash module in TypeScript

Question

I'm trying to re-export an individual lodash module in a TypeScript application as follows:

npm i lodash
npm i @types/lodash

export {default as debounce} from 'lodash/debounce';

When trying to compile with tsc the following error is shown:

Module '".../node_modules/@types/lodash/debounce"' resolves to a non-module entity and cannot be imported using this construct.

and I cannot seem to understand what it means?

tsconfig.json:

{
  "compilerOptions": {
    "moduleResolution": "node",
    "baseUrl": "./",
    "paths": {
    },
    "target": "es5",
    "module": "es6",
    "lib": [
      "es2015",
      "es2016",
      "es2017",
      "dom",
      "scripthost"
    ],
    "downlevelIteration": true,
    "jsx": "react",
    "allowJs": true,
    "checkJs": false,
    "sourceMap": true,
    "noEmit": true,
    "strict": true,
    "noImplicitAny": false,
    "strictNullChecks": true,
    "strictFunctionTypes": false,
    "strictPropertyInitialization": false,
    "noImplicitThis": false,
    "alwaysStrict": true,
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "noImplicitReturns": false,
    "noFallthroughCasesInSwitch": true,
    "esModuleInterop": true
  },
  "include": [
    "src"
  ],
  "exclude": [
  ]
}

tslint.json:

{
    "defaultSeverity": "error",
    "extends": [
        "tslint:recommended",
        "tslint-react"
    ],
    "linterOptions": {
        "exclude": [
            "doc/**",
            "interfaces.flow/**",
            "node_modules/**",
            "rollout/**",
            "temp/**",
            "vendor/**"
        ]
    },
    "rules": {
        "array-type": false,
        "arrow-parens": false,
        "ban-types": false,
        "comment-format": false,
        "forin": false,
        "indent": [true, "tabs"],
        "interface-name" : false,
        "interface-over-type-literal": false,
        "jsdoc-format": false,
        "jsx-no-multiline-js": false,
        "max-classes-per-file": false,
        "max-line-length": [true, 500],
        "member-access": false,
        "no-consecutive-blank-lines": false,
        "no-console": false,
        "no-empty": false,
        "no-shadowed-variable": [
            true,
            {
                "temporalDeadZone": false
            }
        ],
        "no-string-literal": false,
        "member-ordering": false,
        "object-literal-key-quotes": false,
        "object-literal-shorthand": false,
        "object-literal-sort-keys": false,
        "one-variable-per-declaration": false,
        "only-arrow-functions": false,
        "ordered-imports": false,
        "prefer-for-of": false,
        "quotemark": [true, "single", "jsx-double", "avoid-escape", "avoid-template"],
        "semicolon": [true, "always"],
        "space-before-function-paren": {
            "options": {
                "anonymous": "always",
                "asyncArrow": "always",
                "constructor": "never",
                "method": "never",
                "named": "never"
            }
        },
        "trailing-comma": [
            true,
            {
                "esSpecCompliant": true
            }
        ],
        "variable-name": {
            "options": ["ban-keywords", "check-format", "allow-pascal-case", "allow-leading-underscore"]
        }
    },
    "rulesDirectory": []
}

pizzaisdavid pizzaisdavid · Accepted Answer · 2019-01-11T14:44:37

Looking at lodash's debounce source code, the last line is:

export default debounce

This means that the function debounce is the default export of the debounce.js A default export has no name, so it can be renamed as any valid JavaScript name when importing.

To import the default export of the debounce file, do not use curly braces. Then export it on a separate line:

import debounce = require('lodash/debounce');

export { debounce };

or re-export the named function from the library:

export { debounce } from 'lodash';

How to re-export an individual lodash module in TypeScript

1 Answers