Встановлення Bootstrap 3 в Rails App

Я намагаюся встановити 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/?

Важливо додати файли до програми / активів , тому в майбутньому ви зможете замінити стилі Bootstrap.

Якщо пізніше ви хочете додати custom.css.scssфайл із власними стилями. У вас буде щось подібне до цього application.css:

 *= require bootstrap                                                            
 *= require custom  

Якщо ви розмістили файли завантажувальної програми у програмі / ресурсах , все працює як очікувалося. Але, якщо ви розмістили їх у постачальниках / активах , файли 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 копіюються в каталог постачальників вашої програми.

2. Додавання Bootstrap з CDN до програми Rails - Файли Bootstrap 3 подаються з CDN Bootstrap .

Число 2 вище є найбільш гнучким. Все, що вам потрібно зробити, - це змінити номер версії, який зберігається у помічнику макета. Таким чином, ви можете запустити версію Bootstrap на свій вибір, будь то версії 3.0.0, 3.0.3 або навіть старші версії Bootstrap 2.

Зараз у Twitter є версія для завантаження sass з готовим дорогоцінним каменем, тому додати її до Rails простіше, ніж будь-коли.

Просто додайте до свого gemfile наступне:

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

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

Існує також підтримка компаса та лише sass: https://github.com/twbs/bootstrap-sass

Я використовую https://github.com/yabawock/bootstrap-sass-rails

Що в значній мірі прямо встановлено вперед, швидкі оновлення дорогоцінних каменів та подальші дії та швидкі виправлення, якщо це потрібно.

gem bootstrap-sass

bootstrap-sass легко потрапляти в Rails за допомогою конвеєра активів.

У свій Gemfile потрібно додати gem 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) Завантажте і розпакуйте завантажувальну систему в 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/.

Я перезавантажив сторінку і wallah! Я щойно додав завантажувальну машину у свій RoR!