Typescript multiple imports

Question

I want to import 'express' module to my app.

as Mozilla says, we can use this code write below:

import { Application }, * as Express from 'express'

but when I use it in typescript and VSCode it shows error so I forced to use this code:

import * as Express from 'express'
import { Application } from 'express'

how can I solve the problem?

Answer 1

Your code :

import { Application }, * as Express from 'express'

Is wrong. Fortunately you are using TypeScript and its preventing a bug. The correct syntax is:

import * as Express from 'express'
import { Application } from 'express'

Which you have already figured out. You cannot have member imports and * imports in the same line. The MDN docs also reflect that https://developer.mozilla.org/en/docs/web/javascript/reference/statements/import

Answer 2

If I have interpreted TypeScript correctly then importing modules using:

import * as Express from 'express'

Will create a Namespace that you can reference all of the different methods/components inside using syntax such as:

Express.Application

Imports with

import { Application } from 'express'

Will instead only import the Application member of Express, which then is referensed as its own class.

If you don't need everything from Express, then the first import is unnecessary, you can instead chain your dependencies with

import { Application, 'Member1', 'Member2' } from 'express'