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

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

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

Figured it out

application.js

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

jQueryBridget( 'isotope', Isotope, $ );

Sheesh !

Join the discussion

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

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

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

    logo Created with Sketch.

    Ruby on Rails tutorials, guides, and screencasts for web developers learning Ruby, Rails, Javascript, Turbolinks, Stimulus.js, Vue.js, and more. Icons by Icons8

    © 2020 GoRails, LLC. All rights reserved.