我的代码：
import $from 'jquery'
import jQuery from 'jquery'
import owlCarousel from '../../node_modules/owlcarousel/owl-carousel/owl.carousel'
class App {
…
_initSlider() {
$("#partners-carousel").owlCarousel();
}
}
…我在浏览器控制台中“没有定义jQuery”.怎么了？
我可以在这个类的方法中使用jQuery作为$,但不能使用名称’jQuery’.
解决方法
根据
this comment并将其应用于您的案例,当您正在做：
import $from 'jquery' import jQuery from 'jquery'
你实际上并没有使用命名导出.
The problem is that when you do
import $...,import jQuery ...and thenimport 'owlCarousel'(which depends onjQuery),these are evaluated before,even if you declarewindow.jQuery = jqueryright after importingjquery. That’s one of the ways ES6 module semantics differs from CommonJS’ require.
创建文件jquery-global.js
// jquery-global.js import jquery from 'jquery'; window.jQuery = jquery; window.$= jquery;
然后将其导入主文件中：
// main.js
import './jquery-global.js';
import 'owlCarousel' from '../../node_modules/owlcarousel/owl-carousel/owl.carousel'
class App {
...
_initSlider() {
$("#partners-carousel").owlCarousel();
}
}
这样你就可以确保在加载owlCarousel之前定义了jQuery全局.
