我试图使用光滑的轮播(http://kenwheeler.github.io/slick/)并通过npm安装。
通过browserify包含它:
slick = require('slick-carousel')
试图像这样跑:
$('.gallery__carousel').slick();
没有控制台错误,轮播没有初始化。发生了什么事?
答案 0 :(得分:3)
注意:不建议编辑库。如果还是你想要的话 解决方法,然后您可以按照以下方式进行操作。
我在浏览器中使用slick也遇到了同样的问题,但没有一个解决方案适合我。然后我把一个带入了slick.js并改变了 -
查找:
(function(factory) {
'use strict';
if (typeof define === 'function' && define.amd) {
define(['jquery'], factory);
} else if (typeof exports !== 'undefined') {
module.exports = factory(require('jquery'));
} else {
factory(jQuery);
}
}(function($) {
替换:
;(function ( $, window, document, undefined ) {
添加最后一行 -
查找
}));
替换:
})( jQuery, window, document );
希望有助于理解这个问题。
答案 1 :(得分:1)
由于Slick v1.5.x的代码,问题出现了:
(function(factory) {
'use strict';
if (typeof define === 'function' && define.amd) {
define(['jquery'], factory);
} else if (typeof exports !== 'undefined') {
module.exports = factory(require('jquery'));
} else {
factory(jQuery);
}
}
作者假设,如果您使用CommonJS模块加载器(如Browserify),您应该在依赖项中使用jQuery(它直接使用require('jquery')
调用)。
我更喜欢这个解决方案:
npm install --save jquery
window.$ = window.jQuery = require('jquery');
require('slick-carousel');
答案 2 :(得分:1)
我用另一种方式解决了这个问题。有npm包slick-carousel-browserify
。
所以:
npm install slick-carousel-browserify --save-dev
和
$ = require ('./../../bower_components/jquery/dist/jquery.js');
slick = require('slick-carousel-browserify');
slick($('.selector'));
答案 3 :(得分:0)
尝试添加
$ = require('jquery')
前
slick = require('slick-carousel')
它对我有用。
答案 4 :(得分:0)
"browserify-shim": {
"jquery": "global:jQuery",
"slick-carousel": {
"depends": [
"jquery: jQuery"
],
"exports": "$.fn.slick"
}
},
"browserify": {
"transform": [
"browserify-shim"
]
}