TypeError default is not a constructor

[Thomas Fisher]

Version of Dropkick:

2.2.2

Expected Behavior

Dropdown render with no errors.

Actual Behavior

Dropdown does not render. Console has following error:

Uncaught TypeError: _dropkickjs2.default is not a constructor
    at new ScrollBar (scroll-bar.js:35)
    at Object.1118 (home.js:9)
    at __webpack_require__ (bootstrap a33eeaf4ff74951c902a:54)
    at webpackJsonpCallback (bootstrap a33eeaf4ff74951c902a:25)
    at home.js:1

Steps To Reproduce:

1. Import dropkickjs import Dropkick from 'dropkickjs'
2. Instantiate dropkickjs

const langSelect = document.getElementById('langSelect')
const langSelectInstance = new Dropkick(langSelect)

Not sure if my Webpack config has something to do with this? This is what my babel-loader setup looks like:

{
    test: /\.js$/,
    exclude: /node_modules\/(?!cleave.js)/,
    use: {
        loader: 'babel-loader',
        options: {
            cacheDirectory: resolve(
                __dirname,
                '.webpack-cache'
            ),
            presets: [
                [
                    'env',
                    {
                        targets: {
                            browsers: [
                                'last 2 versions',
                                'ie >= 10',
                            ],
                        },
                    },
                ],
                'react',
                'stage-0',
            ],
            plugins: [
                'transform-object-rest-spread',
                'transform-runtime',
            ],
        },
    },
}

[Thierry Michel]

Hi,

FYI, same problem with 2.2.2 and 2.2.1. But works perfectly with 2.2.0…

[Robert DeLuca]

Sorry about this! It's related to changing the main in package.json. It's now pointing to the complied version because before you would have to transpile the ES6 class in your build system -- which wasn't ideal.

But now it seems there's issues with the file that's built. It's not doing the right "module dance" (AMD vs commonjs vs commonjs2 vs root). Fix one bug, create another 😅 I started to take a look at this over the weekend but ran out of time.

Where I left off was dorking with the webpack config to compile umd, but it still left me with the same issue. I'm going to try and find more time this week to try and tackle this. Distributing JS is hard :/

[Thierry Michel]

No problem, great job. :)
It should work with something like this: https://webpack.js.org/configuration/output/#output-librarytarget
I still have strange behavior between dev/watch and production/build (with UglifyJS 2 or 3).
I will try to investigate also on my side.

[Thierry Michel]

I had no time to dig into this issue.
If it can help, here is my last package which correctly exposes module and browser (package.json)

For now, temporarly fixed with: import Dropkick from 'dropkickjs/src/dropkick';

[Robert DeLuca]

Hey everyone! I finally had some time to sit down and figure out what was going on. Basically don't have multiple webpack entries 😰

Give v2.2.3 a try and let me know :)