Skip to content

Uncaught TypeError: $(...).slick is not a function #10

@shaw64489

Description

@shaw64489

Hi,

I've added slick-carousel to the Vendor Libs:

const VENDOR_LIBS = [ 'slick-carousel', 'babel-polyfill', 'redux', 'react-redux', 'react-dom' ]

And initialized in my script.js file:

entry: { regularJS: './assets/js/regularJS.js', vendor: VENDOR_LIBS, script: './assets/js/script.js', },

Here is where its initialized in that script file:

`webpackJsonp([1],{

/***/ 240:
/***/ (function(module, exports, __webpack_require__) {

"use strict";


$(document).ready(function () {
  // Init slick slider + animation
  $('.hero-fade').slick({
    autoplay: true,
    speed: 800,
    lazyLoad: 'progressive',
    // /arrows: false,
    dots: false,
    prevArrow: '<button class="slide-arrow prev-arrow"><i class="fal fa-angle-left"></i></button>',
    nextArrow: '<button class="slide-arrow next-arrow"><i class="fal fa-angle-right"></i></button>',
    responsive: [{
      breakpoint: 768,
      settings: {
        arrows: false,
        dots: true
      }
    }]
  }).slickAnimation();`

I keep getting the error:
Uncaught TypeError: $(...).slick is not a function

But I have Jquery added at the top of my index.html file:

<script
      src="http://code.jquery.com/jquery-3.3.1.min.js"
      integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
      crossorigin="anonymous"
    ></script>

And the vendor and script files added before body end:

<script type="text/javascript" src="/js/components/vendor.js"></script>

    <script type="text/javascript" src="/js/components/regularJS.js"></script>
    
    <script type="text/javascript" src="/js/components/script.js"></script>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions