如何通过 Gulp / Require 在我的 Laravel 应用程序中使用 Dropzone？

Question

我有一个 Laravel 应用程序，我将使用外部 javascript 库 DropzoneJS。我使用 Gulp 生成 1 个 app.js 文件。

这是我的简单gulpfile.js:

// gulpfile.js    
var elixir = require('laravel-elixir');
require("laravel-elixir-webpack");
elixir(function(mix) {
    mix.webpack('app.js');
});

我的第一步：使用 npm install dropzone

安装 Dropzone

我的第二步是 "include" dropzone 到我的 app.js 文件：

//app.js
require('./bootstrap');
require('dropzone');

$(function () {

   // Here the default dropzone code:
   var myDropzone = new Dropzone(document.body, { 
        url: "/target-url", // Set the url
       // etc.
});

现在我运行gulp。现在我看到 Dropzone 包含在我的 app.js 文件中。

但为什么我运行我的网站出现此错误:-(

Dropzone is not defined (in app.js)

如何在我的 $(function(){ }) 或网站内联中使用此 Dropzone 方法？

Answer 1

require('./bootstrap');

window.Dropzone = require('dropzone');

$(function () {
   // Here the default dropzone code:
    var myDropzone = new Dropzone(document.body, {
        url: "/target-url"
    });
});

这应该有效。

如何通过 Gulp / Require 在我的 Laravel 应用程序中使用 Dropzone？

How use Dropzone in my Laravel app with Gulp / Require?

require

laravel

gulp