DEV Community 👩‍💻👨‍💻

Dan Dascalescu
Dan Dascalescu

Posted on

TypeScript settings for modern projects

Modern TypeScript project template

Even though ES modules have been no longer experimental for a few months, many TypeScript users still generate old ES3 code. While that may make sense for browser compatibility, it doesn't make any sense for server-side Node projects! On your server, you control your version of Node, and Node has been supporting modern import/export code natively since version 8.5.0, released in 2017!

At the same time, you want to be able to import npm packages that still (ಠ_ಠ) haven't published native ES modules (e.g. apollo-server, node-influx).

So here's a minimalistic example of configuring TypeScript and Node to do that, and a bit more:

  • emit modern ES modules code
  • import modules that don't have named exports (the ones I linked above)
  • import modules that use Node built-ins
  • import your own modules without specifying an extension
  • run the resulting JavaScript code

Here's how each of these is done.

Emit ES modules code

In tsconfig.json, set this in compilerOptions (don't mind the syntax highlight error here, tsc supports comments in JSON):

    "target": "esnext",
    "module": "esnext",  // Output `import`/`export` ES modules

Import modules that use Node built-ins (http, url etc.)

  • run npm install --save-dev @types/node
  • in tsconfig.json under compilerOptions, set
    • "moduleResolution": "node", so tsc can find modules when targeting ES6+
    • "types": ["node"] to avoid errors related to Node built-in modules

Import modules that don't have named exports

Set "allowSyntheticDefaultImports": true in tsconfig.json. In our code,
instead of import { InfluxDB } from 'influx we have to write:

import Influx from 'influx';
const influx = new Influx.InfluxDB();

Import your own modules without specifying an extension

When transpiling, TypeScript won't generate an extension for you. Run Node with the node --experimental-specifier-resolution=node parameter:

node --experimental-specifier-resolution=node run.js

Otherwise, node mandates that you specify the extension in the import statement.

Run the resulting JavaScript code

Add "type": "module" to package.json, because TypeScript can't generate files with the .mjs extension.

Enjoy using modern TypeScript!

Top comments (0)

We are hiring! Do you want to be our Senior Platform Engineer? We're hiring for a Senior Platform Engineer and would love for you to apply.

Head here to learn more about who we're looking for.