sweetalert2_1.default is not a function

I’m trying to switch from sweetalert to sweetalert2.

Is anyone using this successfully with webpack2 and angular2?

Whatever i try, i always get this error:

Error in :0:0 caused by: sweetalert2_1.default is not a function

My component is the most simple i can guess

import swal from "sweetalert2";
import {Component, OnInit} from "@angular/core";

@Component({
    selector: "dashboard",
    template: require("./dashboard.template.html")
})
export class Dashboard implements OnInit {
    ngOnInit() {
        swal("Hi from webpack!");
    }
}

The code generated by webpack looks like this:

var sweetalert2_1 = __webpack_require__(1334);
var core_1 = __webpack_require__(0);
var Dashboard = (function () {
    function Dashboard() {
    }
    Dashboard.prototype.ngOnInit = function () {
        sweetalert2_1.default("Hi from webpack!");
    };
    Dashboard = __decorate([
        core_1.Component({
            selector: "dashboard",
            template: __webpack_require__(1387)
        }), 
        __metadata('design:paramtypes', [])
    ], Dashboard);
    return Dashboard;
}());
exports.Dashboard = Dashboard;

EDIT: When replacing the import with require the bundle is fine and it works

So replace import swal from "sweetalert2"; with var swal = require("sweetalert2");

But then, no TypeScript Type definitions are recognized 😕

Does anyone know how to workaround?

[toverux]

@readme42 I presume you’re using TypeScript 1.x? Please try my test branch to fix this by running npm i -S toverux/sweetalert2#fix/named-exports, and use the import syntax import swal from "sweetalert2";. That should work.

@limonte I think that’s because older versions of TypeScript don’t like implicit default exports. By changing the way we export the lib using named exports, that should work everywhere, and fix usage in TypeScript 1.x. TypeScript 2.x support implicit default exports for interoperability if I remember correctly. Before upgrading to TS 2 in one of my apps, I also had to use import swal = require('sweetalert2');, otherwise it would have resulted in the same error.

See https://github.com/toverux/sweetalert2/commit/13867fd217d4dfd71ab90497af72bf7f9a64d090

[vishnuindrabalan]

Thanks, good job.