Using WebPack Components

Help Requests
1

I have an Aurelia Application built with NPM\Gulp that has been working perfectly. I recently did an NPM update which upgraded all the components including DropZone.
Dropzone apparently changed it’s build to use WebPack and now Aurelia sees DropZone’s New() Constructor as a Module instead of a function resulting in error " Dropzone is not a constructor"

See some screen shots

Interestingly, I also had a similar problem integrating PDFjs; Also built with WebPack… which I gave up on…
Any Suggestions on how to Require a WebPack component?

2

are you using js or typescript? have you tried import Dropzone from 'dropzone'?

3

I am using TS and I didnt work
error TS1192: Module ‘“dropzone”’ has no default export.

I also tried
foo = new Dropzone.dropzone(el., options) in upper and lower case with no success

I’ve always used the AMD build of Dropzone but this new version might just be broke from the author
I don’t think I have any other dependencies that are built with webpack and didn’t know if there where any known integration issues with Aurela.

Thanks for the help

4

try setting esModuleInterop to true in your tsconfig (see docs), this may break other imports if you are doing import * as X from 'x' elsewhere, in which you can change those to import X from 'x'

5

I had the exactly same issue a few days ago.
The following import works fine.
import Dropzone from "dropzone/dist/dropzone-amd-module";