0

Estou implementando uma parte de notificações em um projeto rails, a partir de um tutorial e estou recebendo este erro.

Uncaught ReferenceError: jQuery is not defined
    at notifications.self-3e6330e4ab7198d8dee61da361c9c6cd1a536fd445b9ce4b6792ea023705ae80.js?body=1:20
    at notifications.self-3e6330e4ab7198d8dee61da361c9c6cd1a536fd445b9ce4b6792ea023705ae80.js?body=1:24

Meu notifications.coffee está assim

class Notifications
  constructor: ->
    @notifications = $("[data-behavior='notifications']")
    @setup() if @notifications.length > 0

  setup: ->
    console.log(@notifications)

jQuery ->
  new Notifications

e está gerando o seguinte .js

(function() {
  var Notifications;

  Notifications = (function() {
    function Notifications() {
      this.notifications = $("[data-behavior='notifications']");
      if (this.notifications.length > 0) {
        this.setup();
      }
    }

    Notifications.prototype.setup = function() {
      return console.log(this.notifications);
    };

    return Notifications;

  })();

  jQuery(function() { //linha 20
    return new Notifications;
  });

}).call(this); //linha 24

Meu html assim

  <li class="nav-item btn-group" data-behavior="notifications">
            <a class="dropdown-toggle nav-link" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="">
            Notifications <b class="caret"></b>
            </a>
            <div class="dropdown-menu" aria-labelledby="dropdownMenu1">
            <a class="dropdown-item" href="#">Action</a><br />
            <a class="dropdown-item" href="#">Another action</a><br />
            <a class="dropdown-item" href="#">Something else here</a><br />
            </div>
  </li>

1 Resposta 1

1

A biblioteca jQuery precisa ser a primeira a ser carregada na página. Algo que não estava acontecendo quando eram compilados os arquivos CoffeeScript em JavaScript e servidos.

Assim, alterei no meu arquivo application.js a parte referente a esta biblioteca, para serem incluídas primeiro que todas as outras, inclusive o Bootstrap.

...
//= require jquery
//= require jquery_ujs
//= require rails-ujs
//= require turbolinks
//= require_tree .
//= require bootstrap

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .