Установка Bootstrap 3 в приложении Rails

Я пытаюсь установить Bootstrap 3.0 в свое приложение Rails. Я недавно закончил учебник Майкла Хартла и сейчас пытаюсь создать свою собственную систему, используя эту новую версию Bootstrap, но у меня есть несколько вопросов, в которых я не уверен.

Мои системные характеристики:

• OS X Mountain Lion на MBP
• Рельсы 4.0
• Рубин 2.0

У меня есть вопросы:

1. Какой драгоценный камень лучше всего использовать в моем Gemfile? Я нашел несколько из них.
2. Что мне импортировать на моем custom.css.scss? Где-то читал, что отличается от 2.3.2.
3. Что еще мне нужно сделать, чтобы заставить Bootstrap работать, или оставшиеся шаги идентичны тем, которые я выполнил для Bootstrap 2.3.2?

редактировать

Вот что сначала говорит проект bootstrap-rails на GitHub :

gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails',
                              :github => 'anjlab/bootstrap-rails'

Затем он говорит:

gem 'anjlab-bootstrap-rails', '>= 3.0.0.0', :require => 'bootstrap-rails'

Они делают одно и то же, или вам нужно делать и то, и другое?

На самом деле вам не нужен гем для этого, вот шаг, чтобы установить Bootstrap 3 в RoR

• Скачать Bootstrap

• Копия:

  bootstrap-dist/css/bootstrap.css и bootstrap-dist/css/bootstrap.min.css

  Кому: vendor/assets/stylesheets

• Копия:

  bootstrap-dist/js/bootstrap.js и bootstrap-dist/js/bootstrap.min.js

  Кому: vendor/assets/javascripts

• Обновление: app/assets/stylesheets/application.css добавив:

  *= require bootstrap.min

• Обновление: app/assets/javascripts/application.js добавив:

  //= require bootstrap.min

Благодаря этому вы можете обновлять загрузочную программу в любое время, без необходимости ждать обновления гема. Также с этим подходом конвейер ресурсов будет использовать минифицированные версии в производстве.

Как многие знают, в драгоценном камне нет необходимости.

Что нужно сделать:

1. Скачать Bootstrap
   • Прямая ссылка для скачивания Bootstrap 3.1.1
   • Или попал на http://getbootstrap.com/

2. Копировать

   bootstrap/dist/css/bootstrap.css
   bootstrap/dist/css/bootstrap.min.css 

   кому: app/assets/stylesheets

3. Копировать

   bootstrap/dist/js/bootstrap.js
   bootstrap/dist/js/bootstrap.min.js 

   кому: app/assets/javascripts

4. Добавить к: app/assets/stylesheets/application.css

   * = требуется начальная загрузка

5. Добавить к: app/assets/javascripts/application.js

   // = требуется начальная загрузка

Вот и все. Вы готовы добавить новый крутой шаблон Bootstrap.

Почему app/вместо vendor/?

Важно добавить файлы в app / assets , чтобы в будущем вы могли перезаписывать стили Bootstrap.

Если позже вы захотите добавить custom.css.scssфайл с пользовательскими стилями. У вас будет что-то похожее на это application.css:

 *= require bootstrap                                                            
 *= require custom  

Если вы разместили файлы начальной загрузки в app / assets , все работает как положено. Но, если вы поместили их в vendor / assets , файлы Bootstrap будут загружены последними. Как это:

<link href="/assets/custom.css?body=1" media="screen" rel="stylesheet">
<link href="/assets/bootstrap.css?body=1" media="screen" rel="stylesheet">

Таким образом, некоторые из ваших настроек не будут использоваться, поскольку стили Bootstrap переопределят их.

Причина этого

Rails будет искать ресурсы во многих местах; чтобы получить список этих мест, вы можете сделать это:

$ rails console
> Rails.application.config.assets.paths

В выводе вы увидите, что приложение / активы имеют приоритет, поэтому сначала загружаются.

Этот ответ предназначен для тех из вас, кто хочет установить Bootstrap 3 в свое приложение Rails без использования гема. Есть два простых способа сделать это менее чем за 10 минут. Выберите тот, который лучше всего соответствует вашим потребностям. Глификоны и Javascript работают, и я также тестировал их с последней бета-версией Rails 4.1.0.

1. Использование Bootstrap 3 с Rails 4 - Файлы Bootstrap 3 копируются в каталог vendor вашего приложения.

2. Добавление Bootstrap из CDN в ваше приложение Rails - файлы Bootstrap 3 обслуживаются из Bootstrap CDN .

Номер 2 выше самый гибкий. Все, что вам нужно сделать, это изменить номер версии, хранящийся в помощнике по макету. Таким образом, вы можете запустить любую версию Bootstrap по вашему выбору, будь то 3.0.0, 3.0.3 или даже более старые версии Bootstrap 2.

У Twitter теперь есть готовая к использованию sass версия bootstrap с включенным gem, поэтому добавить ее в Rails стало проще, чем когда-либо.

Просто добавьте в свой гем-файл следующее:

gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2
gem 'bootstrap-sass', '~> 3.1.1'

bundle install и перезапустите сервер, чтобы файлы стали доступными через конвейер.

Также есть поддержка compass и sass-only: https://github.com/twbs/bootstrap-sass

Я использую https://github.com/yabawock/bootstrap-sass-rails

Это довольно простая установка, быстрое обновление гемов и последующие действия, а также быстрые исправления в случае необходимости.

gem bootstrap-sass

bootstrap-sass легко добавить в Rails с помощью конвейера ресурсов.

В свой Gemfile вам нужно добавить гем bootstrap-sass и убедиться, что гем sass-rails присутствует - он добавляется в новые приложения Rails по умолчанию.

gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2 gem 'bootstrap-sass', '~> 3.0.3.0'

bundle install и перезапустите сервер, чтобы файлы стали доступными через конвейер.

Источник: http://rubydoc.info/gems/bootstrap-sass/3.0.3.0/frames

Для меня самый простой способ сделать это

1) Загрузите и разархивируйте bootstrap в vendor

2) Добавьте путь начальной загрузки в свою конфигурацию

config.assets.paths << Rails.root.join("vendor/bootstrap-3.3.6-dist")

3) Требовать их

в css *= require css/bootstrap

в js //= require js/bootstrap

Готово!

Эти методы заставляют шрифты загружаться без какой-либо другой специальной настройки и не требуют перемещения файлов начальной загрузки из их автономного каталога.

Надеемся, что использование этой ветки решит проблему:

gem 'twitter-bootstrap-rails',
  git: 'git://github.com/seyhunak/twitter-bootstrap-rails.git',
  branch: 'bootstrap3'

Я думаю, что самая свежая жемчужина для новой версии начальной загрузки - это форма anjlab .

Но я не знаю, хорошо ли он в настоящее время работает с другими драгоценными камнями, такими как simple_form, когда вы это делаете rails generate simple_form:install --bootstrap, и т.д., вам, возможно, придется отредактировать некоторые инициализаторы или конфигурации, чтобы они соответствовали новой версии начальной загрузки.

На самом деле у меня был простой обходной путь, в котором я почти ломал голову над тем, как заставить его работать. Хаха!

Ну, сначала я скачал Bootstrap (скомпилированные версии css и js).

Затем я вставил все файлы начальной загрузки css в папку app/assets/stylesheets/ .

Затем я вставил все js-файлы начальной загрузки в папку app/assets/javascripts/ .

Перезагрузил страницу и валлах! Я только что добавил бутстрап в свой RoR!