Can't Find Modules Error In Yeoman Generated Express Typescript Project

Question

I generated an express typescript project using yeoman and anytime i run the application, the get the ff errors: Cannot find module "morgan" Cannot find module "body-parser" Cannot find module "cookie-parser"

But all this modules exits in the node_modules directory, i googled around and the only thing i could find was to run npm link (modulename) without the braces at the root of the project but still the problem exists, I've tried npm install at the root and the error doesnt go away. I have also installed just those missing modules locally and it still doesnt work.

What am i doing wrong.

This is my app.ts.

/// <reference path="./typings/tsd.d.ts"/>
/// <reference path="./typings/index.d.ts" />

import * as path from 'path';
import * as logger from 'morgan';
import * as express from 'express';
import * as bodyparser from 'body-parser';
import * as cookieParser from 'cookie-parser'

// Import our application router class to handle routing.
import { ApplicationRouter } from './routes/index';

// Module for the express application.
var app = express();

// Our express middleware.
app.use( logger('dev') );
app.use( bodyparser.json() );
app.use( bodyparser.urlencoded({ extended: false }) );
app.use( cookieParser() );

// Global application headers.
app.use( (req: express.Request, res: express.Response, next: Function) => {
  res.header( 'Access-Control-Allow-Origin', '*' );
  res.header( 'Access-Control-Allow-Method', 'GET, POST, PUT, PATCH, DELETE, OPTIONS' );
  res.header( 'Access-Control-Allow-Header', 'Origin, X-Requested-With, Content-Type, Accept' );
});

// Router Module
let appRouter = new ApplicationRouter();

// Application's routes.
app.use( appRouter.getIndex() );

// Catch 404 and forward to error handler.
app.use( (req: express.Request, res: express.Response, next: Function) => {
  var error: any = new Error('Not Found');
  error.status = 404;
  next( error );
});

// Development error handler will print stacktrace.
if ( app.get('env') === 'development' ) {
  app.use( (error: any, req: express.Request, res: express.Response, next: Function) => {
    return res.status( error.status || 500 );
  });
}

// Production error handler prints no stacktrace to user.
app.use( (error: any, req: express.Request, res: express.Response, next: Function) => {
  return res.status( error.status || 500 );
});

module.exports = app;

Answer 1

Typescript needs the definition files associated with these modules. The files are usually community maintained and made available on the DefinitelyTyped Github Site

Since typescript 2.0, it is possible to add them to the project using npm.

To install those for morgan for instance simply run

npm install @types/morgan

and so on for every module

(avoid using the /// <reference path= meta-tag. If there is a need to make definitions files available, which are not available through npm - such as the one crafted by yourself - simply use a tsconfig.json file and make sure the typings directory is not excluded from the compilation path)