Typescript: "Cannot find module" with valid typings

Question

I just started a new nodejs project using typescript. I installed Typings (https://github.com/typings/typings) and used that to install reference files for node v4.x and express v4.x.

My node version is v4.2.6 My typescript version is v1.7.5

My project directory is laid out thus:

package.json
tsconfig.json
typings.json
src/
  app.ts
typings/
  main.d.ts
  main/ambient/node/node.d.ts
  main/ambient/express/express.d.ts

The contents of typings/main.d.ts are as follows:

/// <reference path="main/ambient/express/express.d.ts" />
/// <reference path="main/ambient/node/node.d.ts" />

The contents of tsconfig.json are as follows:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs"
  }
}

The contents off typings.json are as follows:

{
  "dependencies": {},
  "devDependencies": {},
  "ambientDependencies": {
    "express": "github:DefinitelyTyped/DefinitelyTyped/express/express.d.ts#dd4626a4e23ce8d6d175e0fe8244a99771c8c3f2",
    "node": "github:DefinitelyTyped/DefinitelyTyped/node/node.d.ts#1c56e368e17bb28ca57577250624ca5bd561aa81"
  }
}

The contents of src/app.ts are as follows:

'use strict';

///<reference path="../typings/main.d.ts"/>

import * as express from "express";

This is exceedingly simple and should result in a basic app. However, when I try to compile this I get the error error TS2307: Cannot find module 'express'.

I have tried rearranging typings files, changing the relative path in the reference path tag, using the files field in tsconfig.json to indicate the reference paths instead of using an inline tag in the file, all to no avail. I have also tried compiling using gulp-typescript, gulp-tsc, and tsc directly on the command line.

I get similar errors when I try to use nodejs build-in modules such as crypto, http, fs etc.

These references seem valid -- what am I missing?

Colloquial

That is all valid. Share the project and I will have a look for you – Leveloff

Sweet thanks. github.com/jereynolds/ts-test – Colloquial

I was just poking around some more and I noticed that the reference path comment still exists in the .js output file. The import statement did get correctly resolved into a standard var express = require('express'); line – Colloquial

Answer 1

Triple-slash directives need to precede any statements in your file. Your "use strict" prologue needs to come after your reference comments as so:

///<reference path="../typings/main.d.ts"/>

'use strict';

import * as express from "express";

As a follow up to your comment where you're not getting any emit for your import: that's because TypeScript performs import elision. Unless you use the module for some value, the compiler won't emit the import because it assumes you only need that module for its types.

Infrequency

When I move the triple-slash above "use strict"; (or remove the "use strict"; line altogether) I just get an additional error in my compile step that the main.d.ts file cannot be found, even though the absolute path given in the error correctly points to the file – Colloquial

Do we need a reference path for each typings we are using? For me I had to find http-server what if I want to use FS as well? – Pleven

If your tsconfig.json refers to the files, or you reference a file like main.d.ts that already lists them, then you shouldn't need to reference those files. – Infrequency

Answer 2

The answer by Daniel is technically correct but based on your tsconfig main.d.ts would have still been picked up so would not fix issues for you.

That said I did find issues and sent a pull request: https://github.com/jereynolds/ts-test/pull/1

---

• You probably should exclude typings and node_modules otherwise the compile will contain duplicate identifiers (typings) / will be slow (node_modules)

• typings install serve-static (needed for express) and mime (needed for serve-static).

Leveloff

“Links to external resources are encouraged, but please add context around the link so your fellow users will have some idea what it is and why it’s there. Always quote the most relevant part of an important link, in case the target site is unreachable or goes permanently offline.” —how-to-answer – Rushing

I installed typings for serve-static and mime, added the typings and node_modules folder to the exclude list in tsconfig.json, and moved "use strict"; to be after the reference tag. Now compilation succeeds with tsc -p ., but still fails when I try to use gulp to build. Any thoughts on why that isn't working? – Colloquial

@CSnover I did. The two bullet points are "most relevant parts of an important link" :) – Leveloff

@Colloquial I don't use gulp :) – Leveloff

Answer 3

I know this is an old question, and sorry for bumping it but it comes up as one of the first links in Google.

Since the above didn't fix my issue and I eventually resolved it, I thought I'd share... In my case, it was relative pathing that caused the issue.

My typings were in

typings/bootstrap, typings/react-dom, typings/react, etc.

The react-dom one has an import from 'react'. To fix my code I had to edit it to be '../react/react'. Simple!

Mizzenmast

Answer 4

None of the above worked for me - so I hope this will help someone else. (I'm using VS Code).

This issue suddenly happened to me out of the blue with one of my services, which was referenced in several modules. After saving a completely non-related component that DIDN'T use the service, two of the components using this service reported the 'cannot find module' error. I was able to fix it by simply changing the declaration to an invalid folder, saving the file and then changing it back to the correct path.

Ucayali