laravel mix with Dropzone

I am trying to use Dropzone in my laravel project using laravel mix. I have added the package using npm install --save dropzone but I get Uncaught ReferenceError: Dropzone is not defined I have tried adding it to the autolaod but I am sure I am doing something wrong. Can someone please assist me in figuring this out.

webpack.mix.js

const mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .autoload({
        jquery: ['$', 'window.jQuery'],
        dropzone: ['{ Dropzone }', 'dropzone']
    })
    .sourceMaps();

The JavaScript code that references dropzone is in side the view in the script tag

bnmn

3 years ago

Level 15

Import it in your "resources/js/app.js" file.

import 'dropzone';

and assign it to a global variable

window.dropzone = dropzone;

run "npm run dev"

Then you should be able to access the dropzone variable in your view.

Please or to participate in this conversation.