Рельсы и бутстрап: Uncaught ReferenceError: jQuery не определен

Я создал простой webapp, интегрирующий бутстрап 3 в приложение rails 3.2.17, следуя qaru.site/info/52073/...

Даже если у меня есть в файле gem:

gem 'jquery-rails'

Я все еще вижу, проверяя мою веб-страницу на хром, ошибка:

Uncaught ReferenceError: jQuery is not defined

Моя страница является "обычной" страницей html в общедоступном каталоге. Может быть, это не "наследует" все активы? Код выглядит так:

<!DOCTYPE html>
<html>
<head>
    <title>Bootsrap Test 01</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>

...

Я еще не пробовал, но думаю, что функция, основанная на javascript, не будет работать.

Ответ 1

Предполагая, что после добавления gem 'jquery-rails' вы выполнили команду bundle install.

Убедитесь, что в app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap.min   // Add it after jquery and jquery_ujs

ИЗМЕНИТЬ

Вам нужно будет явно включить jQuery перед включением /bootstrap.min.js. Например:

<!DOCTYPE html>
<html>
<head>
    <title>Bootsrap Test 01</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/assets/jquery.js" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js" type="text/javascript"></script>
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>

Ответ 2

Даже если вы правильно задали jquery, вы все еще можете увидеть эту проблему, когда вы создаете встроенный код javascript до инициализации jQuery.

Вы можете обернуть свой код javascript в

document.addEventListener("DOMContentLoaded", function(event) { 
  //do work with $
});

Или отредактируйте свой код, чтобы не использовать встроенный javascript:)

Ответ 3

на 'application.js' рельсов 5.0.1 по умолчанию

//= require bootstrap
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .

измените его на

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require bootstrap

* загрузить первый jquery перед загрузкой

Ответ 4

Еще одно место для проверки - <head> файла application.html.erb.

Убедитесь, что вы загружаете jQuery перед javascript Bootstrap.

Ответ 5

Я столкнулся с тем же сообщением об ошибке в консоли.

Просто убедитесь, что jQuery находится выше Bootstrap в файле 'assets/javascripts/application.js'

Решение:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap