Error: *.default is not a constructor

JavascriptTypescriptAva

Javascript Problem Overview


I get the following error, when testing some javascript code, transpiled from a typescript file.

Here is the error:

Error: _mapAction2.default is not a constructor

Here is the line of code that caused the error:

var mapAction = new MapAction(MapActionType.POLYGONDRAGGED, []);

Here is the original typescript-file map-action.ts:

import { IMapAction} from './imap-action';
import { MapActionType } from './map-action-type.enum';
import {LatLngLiteral} from 'angular2-google-maps/core';

export class MapAction implements IMapAction{
    type: MapActionType;
    paths: Array<LatLngLiteral>;

    constructor(mapActionType: MapActionType, paths: Array<LatLngLiteral>){
        this.type = mapActionType;
        this.paths = paths;
    }

    public getType(): MapActionType{
        return this.type;
    }

    public getPaths(): Array<LatLngLiteral>
    {
        return this.paths;
    }

}

Here is the transpiled .js-file map-action.js:

"use strict";
class MapAction {
    constructor(mapActionType, paths) {
        this.type = mapActionType;
        this.paths = paths;
    }
    getType() {
        return this.type;
    }
    getPaths() {
        return this.paths;
    }
}
exports.MapAction = MapAction;
//# sourceMappingURL=map-action.js.map

Javascript Solutions


Solution 1 - Javascript

You need to export a default value which will look like:

export default class MapAction implements IMapAction {...

And import it as:

import MapAction from './map_action_file';

Alternatively, if you want to export multiple things from the module you can do something like:

export class MapAction ...
export class MapSomethng ...

And import it as follows:

import { MapAction, MapSomething } from './map_action_file';

Solution 2 - Javascript

Another solution would be to add "esModuleInterop": true, into tsconfig.json.

esModuleInterop allows default imports from modules with no default export.

Solution 3 - Javascript

Check that your import is correct. you might miss {} for example.

import LatLngLiteral from '';

to

import { LatLngLiteral } from '';

Solution 4 - Javascript

I faced this issue when I was using node JS and mongoDB. the issue was on the way I imported the User model.

This is the way worked for me

import { User } from '../models/User'

Solution 5 - Javascript

If you had tried the answers here and they didn't help then verify the stack trace of your error carefully - I found the circular dependency in my code (but the error was the same as in this question so the cause was absolutely not evident)

Solution 6 - Javascript

Since classes in javascript are syntactic sugar, I figured I'd try to solve this issue without them. For me, switching the architecture over to prototypes seems to have solved my issue. Posting in case anyone else runs into this issue but is already doing export default

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionChristopherMortensenView Question on Stackoverflow
Solution 1 - JavascripteuvlView Answer on Stackoverflow
Solution 2 - JavascriptŽeljko ŠevićView Answer on Stackoverflow
Solution 3 - JavascriptDatsosView Answer on Stackoverflow
Solution 4 - JavascriptncutixavierView Answer on Stackoverflow
Solution 5 - JavascriptNikitaView Answer on Stackoverflow
Solution 6 - JavascriptarshbotView Answer on Stackoverflow