Typescript: Typescript doesnt allow creating module definitions for certain types of ES6 imports

[pdeva]

There is a library I use, 'react-bootstrap-switch', that needs to be imported the following way in TypeScript:

import * as Switch from 'react-bootstrap-switch';

render () {
 return <Switch/>
}

It seems currently TypeScript doesnt allow creating a module definition for a library that exports like this.

If I do this:

declare module 'react-bootstrap-switch'
{
    import React = require("react");
    class Switch extends React.Component<{onColor?:string},{} >
    {}

    export  = Switch;
}

It results in this error:

error TS2497: Module ''react-bootstrap-switch'' resolves to a non-module entity and cannot be imported using this construct.

[RyanCavanaugh]

As a workaround, you can add a line:

declare module 'react-bootstrap-switch'
{
    import React = require("react");
    class Switch extends React.Component<{onColor?:string},{}> {

    }
    module Switch { } // <----

    export = Switch;
}

[blakeembrey]

@pdeva Just a question, but why must you import that way? If's it's using export = it implies a non-ES6 export (E.g. CommonJS and using module.exports =) and can be imported using import Switch = require('react-bootstrap-switch').

[pdeva]

we want to have 100% ES6 code.

[Arnavion]

ES6 modules cannot represent a CJS module that assigns to module.exports. import * as Switch is not required to give you what react-bootstrap-switch assigns to its module.exports; it could instead give you an arbitrary object that has the same properties as whatever was assigned to its module.exports. In particular, if it assigned a function to module.exports (which sounds like the case here since it's a JSX component), you wouldn't necessarily get a function out.

So basically you're writing ES6 code that isn't valid ES6 - it only works when transpiled to ES5 because the ES5 transpilation of import * as Switch is var Switch = require()

If you do still want to write it as an ES6 import, then it would be import Switch from 'react-bootstrap-switch'; with a loader that exposes CJS module.exports as a default ES6 export like SystemJS.

[billti]

I think @Arnavion has addressed this pretty clearly (thanks!). Closing as by design.