CODEWITHSUNDEEP
reactjstypescriptdefinitelytyped
Richard
Richard

Reputation: 16782

How to fix "TS2349: Cannot invoke an expression whose type lacks a call signature"

The DefinitelyTyped library:

declare module "history/lib/createBrowserHistory" 
{
    export default function createBrowserHistory(options?: HistoryModule.HistoryOptions): HistoryModule.History
}

gives the compile error in the title when used like this (although it worked in plain old .jsx before converting to .tsx):

import React = require('react');
import reactDom = require('react-dom');
import ReactRouter = require('react-router');
import createBrowserHistory = require('history/lib/createBrowserHistory');
import routes = require('app/tools/routes');

export function createReactApp() : void
{
    let history = createBrowserHistory(); // <-- error :(
    reactDom.render
    (
        <ReactRouter.Router history={history}>{routes}</ReactRouter.Router>,
        document.getElementById('app')
    );
}

What am I doing wrong?

Upvotes: 5

Views: 6885

Answers (2)

cchamberlain
cchamberlain

Reputation: 17956

If you are having issues, it's likely due to that version being compiled by Babel which is incompatible with TypeScript imports.

Instead, try importing it like this:

import { createBrowserHistory } from 'history';

Upvotes: 1

C Snover
C Snover

Reputation: 18766

The module you are trying to use is an ES6 module, so you must import it using ES6 syntax:

import createBrowserHistory from 'history/lib/createBrowserHistory';

Alternatively you can use the legacy import = syntax and access the default property of the exported object instead for the default export (but you shouldn’t; use the ES6 import!).

Upvotes: 8

Related Questions