【发布时间】:2019-02-26 18:26:44
【问题描述】:
在我的 Laravel 项目 (laravel 5.6) 中,我从 npm 安装了 Jquery。然后我将它添加到 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';
【问题讨论】:
-
如果您尝试使用
jQuery代替$是否有效? -
没有。我尝试了 Jquery 和 jquery。它没有工作
-
jQuery 应该与 laravel 一起开箱即用。你的 bootstrap.js 文件是什么样的?
-
刚刚添加了 bootstrap.js 文件
标签: jquery laravel webpack laravel-mix