How to consume npm modules from typescript?

typescript declare module
typescript cannot find module
tsconfig
could not find a declaration file for module
typescript require
typescript ambient module
module exports typescript
add node to the types field in your tsconfig

I'm giving a shot at typescript. It works fine at the hello world stage. I'm now trying to use a npm module :

index.ts =

import _ = require('lodash')

console.log(_.toUpper('Hello, world !'))

This doesn't work :

  • tsc index.ts -> Cannot find module 'lodash'. (2307)
  • node-ts index.js -> Cannot find module 'lodash'. (2307)

Looking at typescript documentation and in google didn't help. Other S/O questions are either unanswered (here and here) or unrelated.

Elements :

  • typescript 1.8 latest
  • Yes, lodash is installed npm i --save lodash and exists in my filesystem (checked)
  • I also did typings i --save lodash
  • variants import * as _ from 'lodash' or const _ = require('lodash') don't work either
  • I tried tweaking tsconfig.json options as suggested in other answers "moduleResolution": "node" and "module": "commonjs" as suggested in some answers, still doesn't work

How do we consume a npm package in typescript ??

Using Vanilla NPM Javascript Modules With Typescript, We want to use these in our Typescript project, but typescript barks at us Could not find a declaration file for module 'untyped-npm-module'. There are several ways to import modules from npm. But if you don’t get typings, tsc will always complain that it can’t find the module you are requiring (even if transpiled js is actually working).

[2018/12] New, up-to-date, answer to this question I asked in 2016, which stills shows a lot of activity despite having outdated answers.

Long story short, TypeScript requires type informations about your package's code (a.k.a. "type declaration files" a.k.a. "typings") and rightfully tells you that you would otherwise be losing the whole point of TypeScript. There are several solutions to provide them or opt out of them, listed here in order of best practice:


Solution 0: the module already provides the typings. If its package.json contains a line like this:

"typings": "dist/index.d.ts",

it is already TypeScript-enabled. It's most likely not the case if you are reading this page, so let's continue...


Solution 1: use community-contributed typings from DefinitelyTyped. For a module "foo", try this:

npm add -D @types/foo

if it works, jackpot! You now have the typings and can use your module. If npm complains that it can't find the module @types/foo, let's continue...


Solution 2: provide custom typings about this module. (with an option to do zero effort)

  1. Create a folder named "typings-custom" at the root of your project
  2. Reference the content of this folder in your tsconfig.json:
"include": [
    "./typings-custom/**/*.ts"
]
  1. Create a file with this exact name: foo.d.ts [foo = the name of the module] with the content:
declare module 'foo'

Your TypeScript code should now compile, albeit with NO type information (TypeScript consider the foo module of type "any").

You can also attempt to write the type information yourself, looking at the official doc and/or at examples from DefinitelyTyped. If you do, think of contributing your typings either directly into the module (solution 0, if the module author accepts) or into DefinitelyTyped (solution 1)

Step by step: Building and publishing an NPM Typescript package., Even if the one using your package doesn't use Typescript, some editors, like Visual Studio Code will still use the type-definitions to give the  Most npm modules come without a Type definition, so TypeScript developers will have to run an additional npm i @types/<module_name> -D command to be able to use the npm module. Here, we will see how to create an npm module in TypeScript “ importable” in JavaScript and TypeScript.

You're probably missing the Declaration Files.

See DefinitelyTyped for more info.


Try this:

npm install --save lodash
npm install --save @types/lodash

Now you can import.

import _ from 'lodash';

If the module you're importing has multiple exports, you can do this:

import { Express, Router } from 'express';

If the module you're importing "has no default export" you need to do this:

import * as http from 'http';

How to Create and Publish an NPM module in TypeScript, Most npm modules come without a Type definition, so TypeScript developers will have to run an additional npm i @types/<module_name> -D command to be able to use the npm module. From there you’ll be able to use lodash in your TypeScript code with no fuss. This works for both modules and global code. For example, once you’ve npm install-ed your type declarations, you can use imports and write. import * as _ from "lodash"; _.padStart("Hello TypeScript!", 20, " ");

It worked for me.

  1. Create a folder named "typings".
  2. In typings folder, create a file name module-name.d.ts. It contains:

    declare module "module-name";

  3. In tsconfig.json, refer to the folder

    "typesRoots": [ "./typings", "../node_modules/@types" ]

Declaration Files - Consumption, This works for both modules and global code. For example, once you've npm install -ed your type declarations, you can use imports and write import * as _ from  Normally if you want to use a library from npm, which does not provide its own type definitions, you need to either get it from DefinitelyTyped or write them yourself. Looking at the module name, I checked that there are no typescript definitions for react-native-fingerprint-scanner.

Module Resolution · TypeScript, You should use relative imports for your own modules that are guaranteed to A node_modules folder can be on the same level as the current file, or higher up  To install TypeScript local in project as a development dependency you can use --save-dev key. npm install --save-dev typescript It's also writes the typescript into your package.json

Create an NPM module with TypeScript, Formatting: with Prettier. 1. Create a Folder. Use the name of your module. If the name you picked is already used, you can use NPM  Using npm packages with Blazor. Kedren Villena. Follow. Aug 9, For the npm module that we are going to use, we’ll use moment which is a simple module for handling time in JS.

Publishing Node modules with TypeScript and ES modules , Learn how you can write your packages in TypeScript but still ship your users First, create an empty directory and run npm init -y to create a new project. to author in, but which module system TypeScript's compiler will use  With TypeScript 3.8, you can use export * as ns as a shorthand for re-exporting another module with a name: export * as utilities from "./utilities"; This takes all of the dependencies from a module and makes it an exported field, you could import it like this:

Comments
  • Did you add reference to lodash.d.ts in your index.ts? It should look similar to this: ///<reference path="../typings/lodash/lodash.d.ts"/>
  • @Granga It works. Can you add this as an answer ?
  • Glad it works. Blackus has already added the answer and it specifies what I suggested even better. One note though: When input files are specified on the command line(which is your case), tsconfig.json files are ignored. (source)
  • Complete answer with 3 solutions. +1
  • Addition: it even works with ts-node as long as the typings index is referenced in tsconfig.json
  • Im confused by what you mean to "declare it to discard the error." Do I need to make this change in the module I am trying to import?
  • This answer is severely outdated. See my new answer below stackoverflow.com/a/53786892/587407
  • @Offirmo, We can also declare multiple custom typings in a single file as well! So, No need for multiple files (Maybe?).
  • Step 2. Reference the content of this folder in your tsconfig.json: gives the following error: Unknown compiler option 'include'.
  • @Sumit it's not a compiler option, it should be a sibling of compilerOptions
  • Why do we have to use * as _ and not just _ from 'lodash' as in ES6 code?