Sweetalert2: Uncaught (in promise): Error: Error in :0:0 caused by: sweetalert2_1.default is not a function TypeError: sweetalert2_1.default is not a function

Created on 9 Jan 2017  路  4Comments  路  Source: sweetalert2/sweetalert2

Uncaught (in promise): Error: Error in :0:0 caused by: sweetalert2_1.default is not a function
TypeError: sweetalert2_1.default is not a function

I get the following error when I call any sweet alert function. I'm using the latest sweetalert2 version and I'm using angular2 with webpack. I'm unsure how to debug this as i'm new to typescript.

Here is my tsconfig:

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "baseUrl": "./app"
    }
}

bug

Most helpful comment

Okay, that's what I thought :) You have SweetAlert2 6.2.9 while 6.3.0 is out and addresses this bug.

脌 propos, yes, SweetAlert2 is developed using ES 2015, but the library is distributed as UMD ES 5, so you don't have to worry about that ;)

All 4 comments

Hm. That should not happen, yes.
Could you show the ouput of

import swal from 'sweetalert2';
console.log(swal);

If that returns undefined, try with

import * as swal from 'sweetalert2';
console.log(swal);

Thanks. Also, what version of TypeScript do you use? Are you sure that you're running the latest version of SweetAlert2? I also use SA2 in a Angular2/TS project and it's fine, there may be some outdated deps here.

Thanks for responding tover. I am currently using typescript version 2.1.4 and SA2 6.2.9

I get undefined from your first suggestion. However, my output from

import * as swal from 'sweetalert2'; console.log(swal);

is

````
function sweetAlert() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}

  if (sweetAlert.isVisible()) {

````

And when I invoke the function swal('test') I get a compile error

ERROR in [at-loader] app/services/test.service.ts:10:1
    Cannot invoke an expression whose type lacks a call signature. Type 'typeof "sweetalert2"' has no compatible call signatures.

I have suspicion this has to do with the fact that SA2 is ES6 where i'm compiling to ES5 with webpack

Okay, that's what I thought :) You have SweetAlert2 6.2.9 while 6.3.0 is out and addresses this bug.

脌 propos, yes, SweetAlert2 is developed using ES 2015, but the library is distributed as UMD ES 5, so you don't have to worry about that ;)

Thanks that seems to fix the error. Now I need to get my scss loaded correctly.

Thanks tover.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

snsarma picture snsarma  路  3Comments

limonte picture limonte  路  3Comments

jharrvis picture jharrvis  路  3Comments

gouhary picture gouhary  路  3Comments

SasSam picture SasSam  路  3Comments