Creating a d.ts file for existing module

Question

I'm trying to create a d.ts file for the React StaticContainer library.

The installed lib in NPM looks like this:

var React = require('react');

var StaticContainer = (function (_React$Component) {

  function StaticContainer() {
    // ...
  }

  // ...

  return StaticContainer;
})(React.Component);

module.exports = StaticContainer;

An example usage is like this:

var StaticContainer = require('react-static-container');

And I'm not sure how to create a declaration for this and use it in TypeScript. So far from my research I've come up with this:

import * as StaticContainer from 'react-static-container'

And this d.ts file:

interface StaticContainer extends React.Component<any, any> {
  shouldUpdate?:boolean;
}

declare module "react-static-container" {
  export = StaticContainer;
}

However TSC gives me this error:

Error:(3, 34) TS2497: Module '"react-static-container"' resolves to a non-module entity and cannot be imported using this construct.

I'm rather confused how the module.exports = StaticContainer should translate to a d.ts file. How is this done?

Answer 1

Module '"react-static-container"' resolves to a non-module entity and cannot be imported using this construct.

Exactly what the error says. You need to import export = style libraries with import require. This is because of the ES6 spec.

import StaticContainer =  require('react-state-container');