Using requireJS with jQuery plugin

Question

I need to use this slick slider plugin inside my code, but could not reach it!

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; }); 

In the configuration, I have:

 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' } } }); 

But its results; Uncaught ReferenceError: slick is not defined

Answer 1

Oops! I found out why I got errors :)

The first fix, I removed the slick function; define('modules/slider', ['jquery', 'slick'], function($){

In console console.log was wrong, I used instead

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

Thanks:)