jQuery 没有在我的 webpack encore 上定义
Posted
技术标签:
【中文标题】jQuery 没有在我的 webpack encore 上定义【英文标题】:jQuery is not defined on my webpack encore 【发布时间】:2020-10-27 22:22:39 【问题描述】:在我的 app.js 上有
import $ from 'jquery';
global.$ = global.jQuery = $;
import 'chart.js/dist/Chart.min';
import 'chartjs-plugin-labels/build/chartjs-plugin-labels.min';
import 'bootstrap/js/dist/dropdown';
import '../../vendor/snapappointments/bootstrap-select/dist/js/bootstrap-select.min';
import 'ajax-bootstrap-select/dist/js/ajax-bootstrap-select.min';
import Lightpick from 'lightpick';
这是我的 webpack.confing-js
.setOutputPath('public/build/')
.setPublicPath('/build')
.enableVersioning()
.addEntry('app', './assets/js/app.js')
.splitEntryChunks()
.enableSingleRuntimeChunk()
.cleanupOutputBeforeBuild()
.enableBuildNotifications()
.autoProvidejQuery()
错误...无法正常工作。尝试了很多解决方案,但没有任何效果
ajax-bootstrap-select.min.js:21 Uncaught ReferenceError: jQuery is not defined
at Object../node_modules/ajax-bootstrap-select/dist/js/ajax-bootstrap-select.min.js (ajax-bootstrap-select.min.js:21)
【问题讨论】:
你试过 import * as $ from 'jquery' 吗? 不,这对我不起作用 【参考方案1】:我在使用 Bootstrap 和 JQuery 时遇到了完全相同的问题。
我给你写了我的解决方案,希望对你有用:
/** app.js **/
//.. Here I include the app.scss
//import $ from 'jquery' DOESN'T WORK
const $ = require('jquery');
Window.prototype.$ = $; //HERE IS MY SOLUTION (Without this line it doesn't work!)
//Here I declare bootstrap
require('bootstrap');
//..
// I include some library which need JQuery
require('bootstrap/js/dist/tooltip');
require('bootstrap/js/dist/popover');
import bsCustomFileInput from "bs-custom-file-input";
//Now $ is working!
$(document).ready(function ()
$('[data-toggle="popover"]').popover();
$('[data-toggle="tooltip"]').tooltip();
$('[data-toggle=offcanvas]').click(function ()
$('.row-offcanvas').toggleClass('active');
);
);
在我的 webpack.config.js 中,我不会取消注释这些行
// uncomment if you're having problems with a jQuery plugin
//.autoProvidejQuery()
【讨论】:
谢谢工作,但我必须在 webpack.config 上启用 autoProvidejQuery()以上是关于jQuery 没有在我的 webpack encore 上定义的主要内容,如果未能解决你的问题,请参考以下文章
Rails 6:如何通过 webpacker 添加 jquery-ui?