Save 36% for Black Friday! Learn more

Ask A Question

Notifications

You’re not receiving notifications from this thread.

Webpacker noob - so I saw your video and im using rails 6

Gus P asked in Rails

how does one go by installing https://github.com/metafizzy/isotope with webpacker?

yarn add isotope-layout
require('isotope-layout')

now I get an error

      .col-md-9
        .entry-content.mb-5
          - @staff.each do |faculty|
            .card-wrapper
              - if faculty.profile.attached?
                = link_to image_tag(url_for(faculty.profile)), '#', class: 'card-img-top'
              .card-text-area
                = link_to "#" do
                  %p.card-text
                    %i
                      = faculty.staff_title
                  %h5.strong
                    = faculty.title

:javascript
  $('.entry-content').isotope({
    // options
    itemSelector: '.card-wrapper',
    layoutMode: 'fitRows',
    percentPosition: true,
    gutter: 10
  });

(index):311 Uncaught TypeError: $(...).isotope is not a function
    at (index):311
Reply

I checked to see if isotope was there in the pack_tag its there am I missing something?

Reply
Reply

Figured it out

application.js

var jQueryBridget = require('jquery-bridget');
var Isotope = require('isotope-layout');

jQueryBridget( 'isotope', Isotope, $ );

Sheesh !

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 86,946+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.