Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

224
Visualizações
Uncaught TypeError: $(...). is not a function when I import a library with Webpack

I'm trying to import a library inside my bundle and I try in every way, but everytime I get an error.

The library is Justified-Gallery but sometimes this happen also with other library and I have to understand where is the issue.

I'm using webpacker with Rails.

This is my entry point, and lightGallery, another library I'm using, is working.

import 'lightgallery/scss/lightgallery-bundle'

// init vendor
import lightGallery from 'lightgallery'
import lgThumbnail from 'lightgallery/plugins/thumbnail'
import lgZoom from 'lightgallery/plugins/zoom'

window.lgZoom = lgZoom
window.lgThumbnail = lgThumbnail
window.lightGallery = lightGallery
require('justifiedGallery')


// init global user javascript
import './js/init.js';

Init.js is my main script

import NavbarSingleTon, { Navbar } from './navbar';
import GallerySingleTon, { Gallery } from './gallery';

(function init() {
  document.addEventListener('DOMContentLoaded', () => {
    Navbar.init();
    Gallery.init();
  });
}());

And finally this is my gallery.js

export class Gallery {
  constructor($el) {
    $el.justifiedGallery({
      captions: false,
      lastRow: "hide",
      rowHeight: 180,
      margins: 5
    })
    .on("jg.complete", function () {
      window.lightGallery(
        document.getElementById("dmove_gallery"),
        {
          autoplayFirstVideo: false,
          pager: false,
          galleryId: "dmove",
          plugins: [lgZoom, lgThumbnail],
          mobileSettings: {
            controls: false,
            showCloseIcon: false,
            download: false,
            rotate: false
          }
        }
      );
    });
  }

  static init() {
    $(".gallery-container").each((i, el) => new Gallery($(el)));
  }
}

The error I have in console is

gallery.js:5 Uncaught TypeError: $(...).justifiedGallery is not a function

I try to understand why, and require('justifiedGallery') require this script

I try with

import justifiedGallery from 'justifiedGallery'
window.justifiedGallery = justifiedGallery

But nothing... I cannot solve this issue

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda