$ не определено - Laravel Jquery не найден? - PullRequest
0 голосов
/ 22 сентября 2018

В моем проекте Laravel (laravel 5.6) я установил Jquery из npm.Затем я добавил его в webpack.mix.js.

mix.webpackConfig(webpack => {
    return { plugins: [new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: ["jquery", "$"],
                "window.jQuery": "jquery",
                Popper: ["popper.js", "default"]
            })] };
});

после компиляции ресурсов и попытки использовать jquery показывает

 "Uncaught ReferenceError: $ is not defined"

Я использую свой пользовательский файл JavaScript после загрузки файла микса в моем представлении.

<script src="{{ mix('/js/app.js') }}"></script>
<script type="text/javascript" src="/js/tests/tests.js"></script>

В свой пользовательский файл JavaScript я добавил следующий код для проверки Jquery.

$("#myCheckButton").click(function(e) {
  console.log(test);
});

Я попытался изменить настройки webpack.min.js webPackconfig, но не смог решить эту проблему.На большинство подобных вопросов рекомендуется ставить пользовательские файлы js после микса.Я думаю, что я правильно понял в моем случае

Редактировать: И есть еще одна ошибка

jquery-jvectormap.min.js?37ce:1 Uncaught TypeError: Cannot read property 'fn' of undefined
    at eval (jquery-jvectormap.min.js?37ce:1)
    at Object.eval (jquery-jvectormap.min.js?37ce:1)
    at eval (jquery-jvectormap.min.js:6)
    at Object../node_modules/jvectormap/jquery-jvectormap.min.js (app.js?id=3e76ba2082961d8bb73a:654)
    at __webpack_require__ (app.js?id=3e76ba2082961d8bb73a:20)
    at eval (index.js:3)
    at Object../resources/assets/js/vectorMaps/index.js (app.js?id=3e76ba2082961d8bb73a:1820)
    at __webpack_require__ (app.js?id=3e76ba2082961d8bb73a:20)
    at eval (bootstrap.js:9)
    at Object../resources/assets/js/bootstrap.js (app.js?id=3e76ba2082961d8bb73a:1652)

В соответствии с просьбой здесь мой файл bootstrap.js

import './masonry';
import './charts';
import './popover';
import './scrollbar';
import './search';
import './sidebar';
import './skycons';
import './vectorMaps';
import './chat';
import './datatable';
import './datepicker';
import './email';
import './fullcalendar';
import './googleMaps';
import './utils';
import './sweetalert2';
import './select2';

1 Ответ

0 голосов
/ 22 сентября 2018

Поместите это в верхнюю часть вашего resources\assets\js\app.js файла.

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

Источник:

https://github.com/webpack/webpack/issues/4258#issuecomment-340240162

...