javascript - Why is TypeScript adding .default to a globally defined import?

Question

I have an external library thing.d.ts file with a global definition inside:

declare var thing: ThingStatic;
export default thing;

I reference npm module in my TypeScript:

import thing from 'thing';
...
thing.functionOnThing();

When I transpile the TS (targeting ES6) it looks something like this:

const thing_1 = require("thing");
...
thing_1.default.functionOnThing();

This then throws an error:

Cannot read property 'functionOnThing' of undefined

Why is TypeScript adding .default between thing_1 and functionOnThing()?

There is no property named default on ThingStatic, and no default property on the underlying JS object that the .d.ts file defines.

Why is TypeScript adding the property and how do I stop it?

Answer 1

import thing from 'thing';

This line of code means "import the default export from the module 'thing' and bind it to the local name thing".

TypeScript does as you requested and accesses the default property of the module object.

What you probably meant to write was

import * as thing from 'thing';