typescript - Is there a way to use --esModuleInterop in tsconfig as opposed to it being a flag?

Question

Typescript v 2.7 released really neat flag called --esModuleInterop https://www.typescriptlang.org/docs/handbook/compiler-options.html, I am trying to figure out if there is a way to use it with tsconfig.json as currently it doesn't seem to be documented : http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Unless it somehow works with module?

Main use case I want to achieve is to be able to import things like this

import React from "react"

as opposed to

import * as React from "react"

And do so from my tsconfig if possible

Answer 1

Yes, do "esModuleInterop": true in your tsconfig.json. For every flag option that can be passed to the CLI, the same can usually be done this way in the config file. Doing tsc --init on the command line generates a tsconfig full of comments explaining all of the available options.

---

EDIT: I've learned that the behavior of esModuleInterop is dependent on what is set to module.

If you have "module": "commonjs", you only need to enable "esModuleInterop": true.

If you have "module": "es2015" or "module": "esnext", you also have to enable "allowSyntheticDefaultImports": true in order to import CommonJS modules (like React) as a default.