在laravel 5.4 mix上添加jQuery

Question

我已经熟悉了laravel 5.1 mix（elixir），最近我决定测试laravel 5.4 mix。

我在供应商文件中混合了我的库。

mix
.styles([
    './node_modules/bootstrap/dist/css/bootstrap.css',
    './node_modules/font-awesome/css/font-awesome.css'
], 'public/css/vendor.css')
.js([
    './node_modules/jquery/dist/jquery.js',
    './node_modules/bootstrap/dist/js/bootstrap.js',
], 'public/js/vendor.js')
.disableNotifications()
.version();

并在我的页面上包含供应商。

<script src="{{ mix('js/vendor.js') }}" type="text/javascript" charset="utf-8" async defer></script>

但是，当我想使用jQuery时，我在下面的图像上有这个错误。 之前，在laravel 5.1中，我的确如此。

我需要做什么？

Answer 1

只需在assets/js/bootstrap.js文件中取消注释该行：

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

并确保要求您的assets/js/app.js的bootstrap文件如下：

require('./bootstrap');

Answer 2

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

我不得不将它添加到我的webpack.mix.js

Answer 3

使用laravel mix的解决方案是强制所有模块使用相同的jquery版本：这是我在webpack.mix.js顶部的代码：

mix.webpackConfig({
    resolve: {
        alias: {
             'jquery': path.join(__dirname, 'node_modules/jquery/src/jquery')
        }
    }
});