使用requireJS与jQuery插件

Question

我需要在我的代码中使用这个滑块插件 "slick"，但是我无法做到！

define('modules/slider', ['jquery', 'slick'], function($, slick) {
    var widgetDisplay = function() {};
    widgetDisplay.prototype = {
        name: 'Display',
        init: function(scope) {
            "use strict";

            var me = this;

            console.log('slider module loaded + ' + slick);

        }
    };

    return widgetDisplay;
});

在配置文件中，我有以下内容；

require.config({
        baseUrl: '<?php echo WPF__ASSETS; ?>scripts/',
        paths: {
            "modernizr": "<?php echo WPF__ASSETS; ?>scripts/modernizr",
            "jquery": "<?php echo WPF__ASSETS; ?>scripts/jquery",
            "fastclick": "<?php echo WPF__ASSETS; ?>scripts/fastclick",            
            "foundation": "<?php echo WPF__ASSETS; ?>scripts/foundation",
            "slick": "<?php echo WPF__ASSETS; ?>scripts/slick"
        },
        shim: {
            'foundation': {
                deps: ['jquery']
            },
            'slick': {
                deps: ['jquery'],
                exports: 'jQuery.fn.slick'
            },
            'modernizr': {
                exports: 'modernizr'
        }
        }
    });

但是他的输出报错;

未捕获的引用错误：slick未定义

- numediaweb

Answer 1

哎呀！我找到了为什么出错的原因 :)

首先进行修复，我在函数中删除了 slick；define('modules/slider', ['jquery', 'slick'], function($){

控制台日志输出的方法有误，我改用了以下方法；

$('#header_slider').slick({
            slidesToShow: 3,
            slidesToScroll: 1,
            autoplay: true,
            autoplaySpeed: 2000,
            onInit: function() {
                console.log('Slick is on!');
            }
});

感谢您的选择 :)

- numediaweb