Unable use swal with src/sweetalert2.js for use in ES6

[altbdoor]

To quote the usage instructions:

It's possible to import JS and CSS separately, e.g. if you need to customize styles:

import swal from 'sweetalert2/src/sweetalert2.js'
import 'sweetalert2/src/sweetalert2.scss'

However, after importing sweetalert2/src/sweetalert2.js, any calls to swal throws up an error of:

• Firefox 61: TypeError: class constructors must be invoked with |new|.
• Chrome 67: Class constructor SwalWithGlobalDefaults cannot be invoked without 'new'

As per required for a bug report:

• a JS Bin in order for us to be able to reproduce the issue
  I used CodeSandbox since it allows a npm install-like environment. https://codesandbox.io/s/n0mx3jn7nm

• expected behavior of the plugin
  A SweetAlert2 popup should appear.

• actual behavior
  An error occurs when attempting to call swal.

[limonte]

Thanks for the report @altbdoor!

Confirming the issue, the temp solution could be

import swal from 'sweetalert2/dist/sweetalert2.js'
//                            ^^^^

But we need to figure out what's happening here. @zenflow do you have any quick guess?

I wonder how the same working in sweetalert2-parcel-demo.

[altbdoor]

@limonte yeah, I am using the same temporary solution as well 😄 thanks!

To test things out, I have forked the sweetalert2-parcel-demo repo, and did a fresh npm install and npm build. It seems to be getting the same issue as reported.

https://altbdoor.github.io/sweetalert2-parcel-demo/dist/

[limonte]

To test things out, I have forked the sweetalert2-parcel-demo repo, and did a fresh npm install and npm build. It seems to be getting the same issue as reported.

Oops, thanks for pointing that out! It's a regression after #1045

v7.18.0 works fine, the issue appears in v7.19.0 which contains #1045

[limonte]

@zenflow I need your help on this issue.

[limonte]

@zenflow did you maybe have a chance to take a look at this issue?

[zenflow]

@limonte no, i lost this issue, so thanks for the reminder.. i'm having a look now

[zenflow]

@altbdoor what is your use-case? why do you need to use the source instead of the compiled build?

[altbdoor]

Hi @zenflow

Nope, there was no particular use-case. I was only trying to import the src since that was how it was documented on the site to import sweetalert before this.

[limonte]

Nope, there was no particular use-case. I was only trying to import the src since that was how it was documented on the site to import sweetalert before this.

In that case, we can consider this as a documentation issue which is fixed now both for https://sweetalert2.github.io/ and the README.md

Thanks, @altbdoor and @zenflow!

[zenflow]

@limonte We could also remove the src folder from the published package.. what do you think?

[limonte]

@zenflow agree, but we can do that only in the next major. Prior v7.18.0 users were able to import swal from 'sweetalert2/src/sweetalert2.js' and some of them might have this code in their projects.

Here's the issue: #1185