'Express not working with Typescript in NodeJS app

I'm learning Typescript, and I have followed a tutorial using it with and express api app verbatim but I get the following error:

D:\Development\Node\Ed\TypeScript\src\app.ts:5
const app: Application = express();
                                ^
TypeError: express_1.default is not a function
    at Object.<anonymous> (D:\Development\Node\Ed\TypeScript\src\app.ts:5:33)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Module.m._compile (D:\Development\Node\Ed\TypeScript\node_modules\ts-node\src\index.ts:814:23)
    at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Object.require.extensions.(anonymous function) [as .ts] (D:\Development\Node\Ed\TypeScript\node_modules\ts-node\src\index.ts:817:12)   
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
    at main (D:\Development\Node\Ed\TypeScript\node_modules\ts-node\src\bin.ts:226:14)

I have no idea how to fix and would appreciate any directions

app.ts file:

import express, { Application, Request, Response, NextFunction } from 'express';

const app: Application = express();

app.get('/', (req: Request, res: Response, next: NextFunction) => {
    res.send('hello');
});

app.listen(5000, () => console.log('Server running'));

tsconfig.json:

{
  "compilerOptions": {
    "target": "es6",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "outDir": "./dist",                        /* Redirect output structure to the directory. */
    "rootDir": "./src",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
    "removeComments": true,                /* Do not emit comments to output. */
    "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
    "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
  }
}
node.jstypescriptexpress


Solution 1:[1]

I followed the instructions on this site

and it works fine.

Did you install @types/express as a dev dependency?

npm i --save-dev @types/express

my index.ts:

 import express, {Application} from 'express';

const app: Application = express()

app.listen(5000, ()=>{
    console.log('server runnning')
})

my tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "esModuleInterop": true,
        "target": "es6",
        "noImplicitAny": true,
        "moduleResolution": "node",
        "sourceMap": true,
        "outDir": "dist",
        "baseUrl": ".",
        "paths": {
            "*": [
                "node_modules/*"
            ]
        }
    },
    "include": [
        "src/**/*"
    ]
}

my tslint.json:

{
    "defaultSeverity": "warning",
    "extends": [
        "tslint:recommended"
    ],
    "jsRules": {},
    "rules": {
        "trailing-comma": [ false ]
    },
    "rulesDirectory": []
}

and finally, my package.json

{
  "name": "tsnjs",
  "version": "1.0.0",
  "description": "",
  "main": "dist/index.js",
  "scripts": {
    "prebuild": "tslint -c tslint.json -p tsconfig.json --fix",
    "build": "tsc",
    "prestart": "npm run build",
    "start": "node .",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1"
  },
  "devDependencies": {
    "@types/express": "^4.17.2",
    "tslint": "^6.0.0",
    "typescript": "^3.8.2"
  }
}

node -v v13.9.0

Solution 2:[2]

I found a solution for allowing the following import style

import express, {Express} from "express";

Firstly, it's important in your package.json you're running tsc correctly by pointing to your tsconfig.json file using the --project flag.

{
  "scripts": {
    "build": "tsc --project ./tsconfig.json",
    "start": "node ./build/app.js"
  }
}

The required flags in tsconfig.json are (You can also include your own).

{
  "compilerOptions": {
    "outDir": "build",        // Not required, but it helps :)
    "module":"commonjs",      // Required
    "esModuleInterop": true   // Required
  },
  "include": ["./dirToTSFiles/**/*.ts"] // Target .ts files in your project
}
  • esModuleInterop - Allows TSC to compile the default express import.
  • commonjs - Another flag required to run your compiled *.js file. Or you might run into:
SyntaxError: Cannot use import statement outside a module

After running npm run build, you should be able to use npm run start :)

I know this will help.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nicolai Veliki
Solution 2

Related Questions