【问题标题】:Laravel Mix always include jQueryLaravel Mix 总是包含 jQuery
【发布时间】:2019-01-13 04:24:11
【问题描述】:

我使用 Laravel 5.6 和 Mix。我想将一个使用 jQuery 的插件加载到我的项目中。

我创建了一个 fileuploader.js 文件:

// see more at http://plugins.krajee.com/file-input#installation

import 'bootstrap-fileinput/js/fileinput';
import 'bootstrap-fileinput/js/locales/fr';

它加载一个 npm 包。在我的 webpack.mix.js 中,我有:

mix.autoload({
    jquery: ['$', 'window.jQuery']
});

mix
    .js('resources/assets/js/app.js', 'public/js')
    .js('resources/assets/js/fileuploader.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .sass('resources/assets/sass/plugins/fileuploader.scss', 'public/css')
;

mix.copyDirectory('resources/assets/img', 'public/img');

if (mix.inProduction()) {
    mix.version();
}

在我的 app.js 中,我有:

import $ from 'jquery';
window.$ = window.jQuery = $;
import './bootstrap';

$(function() {
  // some jQuery code
});

我从 bootstrap.js 文件中删除了这一行:

window.$ = window.jQuery = require('jquery');

但是当我查看使用 Webpack 生成的 /js/fileuploader.js 文件时,它仍然会加载完整的 jQuery 代码。

我的模板中的结果是:

<script src="http://localhost:8000/js/app.js"></script>
<script src="http://localhost:8000/js/fileupload.js"></script>
<script>
    $(function () {
        $('input[type="file"]').fileinput({
            language: 'fr',
            uploadUrl: '/upload',
        });
    })
</script>

我得到了这个错误:

未捕获的类型错误:$(...).fileinput 不是函数

我想这是因为 jQuery(版本 3.3.1)在两个 JS 文件中加载了 2 次。我怎样才能防止这种情况?谢谢

【问题讨论】:

    标签: laravel laravel-mix


    【解决方案1】:

    尝试删除

    mix.autoload({
        jquery: ['$', 'window.jQuery']
    });
    

    【讨论】:

      猜你喜欢
      • 2019-05-30
      • 2020-05-11
      • 2017-10-13
      • 2021-06-23
      • 2018-10-12
      • 1970-01-01
      • 2017-07-26
      • 2018-08-27
      • 2018-09-23
      相关资源
      最近更新 更多