Typescript definition file is not a module

Viewed 2578

I would like to load a protoyped JavaScript object into my Reactjs project using an import statement.

First, I have a prototyped Javascript object that I export as a Webpack module:

var FloDialog=function(t){this.id=Date.now(),this.cloak=this.rende // etc //etc

if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
    module.exports = FloDialog;
}

Then In the type definition file flo-dialog.min.d.ts I have the code you see below:

declare module 'flo-dialog' {

interface FloDialogOptions {
    cache: boolean;
    position: string;
    effect: {
        fade: boolean;
        fill: boolean;
    }
}

interface FloDialog {
    constructor(opts?: FloDialogOptions): void;
    openUrl(title: string, url: string, callback?: () => void): void;
}

const FloDialog: FloDialog;
export = FloDialog;

}

Finally I use the import statement import * as FloDialog from '../public/js/flo-dialog.min'; In the React component Main.tsx file.

It works in the browser, but I am getting the Typescript error: TS2306: File '/public/js/flo-dialog.min.d.ts' is not a module.

So, how do I correctly import a JavaScript prototyped object with the import statement in React... and have it be strongly typed? What's wrong with my approach so far?

Update: Kokodoko comment was usefull.

I now import the type interfaces via import {IFloDialog} from './types/index'; and the Webpack module via const FloDialog = require('../public/js/flo-dialog.min');

I am not sure if this is the way to do it. But it works, without Typescript errors and there is autocompletion in the IDE... and it works int he browser.

0 Answers
Related