使用requireJS和jQuery插件

时间:2014-09-15 21:02:01

标签: jquery requirejs

我需要在我的代码中使用此滑块插件“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'
        }
        }
    });

但他的产出; Uncaught ReferenceError: slick is not defined

1 个答案:

答案 0 :(得分:3)

糟糕!我发现了为什么会出错:)

首先修复,我删除了函数的slick; define('modules/slider', ['jquery', 'slick'], function($){

console.log的事情错了,我改用了;

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

谢谢:)