Rails 앱에 Bootstrap 3 설치

Rails 앱에 Bootstrap 3.0을 설치하려고합니다. 저는 최근에 Michael Hartl의 튜토리얼을 마쳤고 이제이 새로운 버전의 Bootstrap을 사용하여 나만의 시스템을 구축하려고 시도하고 있지만 몇 가지 질문이 있습니다.

내 시스템 사양 :

• MBP의 OS X Mountain Lion
• 레일스 4.0
• 루비 2.0

내가 가진 질문 :

1. 내 Gemfile에서 사용하기에 가장 좋은 보석은 무엇입니까? 몇 가지를 찾았습니다.
2. 에서 무엇을 가져 오나요 custom.css.scss? 2.3.2와 다른 곳을 읽었습니다.
3. Bootstrap이 작동하도록하기 위해해야 ​​할 다른 일이 있습니까? 아니면 나머지 단계가 Bootstrap 2.3.2에서 따랐던 것과 동일합니까?

편집하다

다음은 GitHub 의 bootstrap-rails 프로젝트가 처음으로하는 작업입니다.

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

그런 다음 이렇게 말합니다.

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

그들은 같은 일을합니까, 아니면 둘 다해야합니까?

실제로 이것을 위해 gem이 필요하지 않습니다. RoR에 Bootstrap 3을 설치하는 단계가 있습니다.

• 부트 스트랩 다운로드

• 부:

  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

이를 통해 언제든지 부트 스트랩을 업데이트 할 수 있으므로 gem이 업데이트 될 때까지 기다릴 필요가 없습니다. 또한이 접근 방식을 통해 자산 파이프 라인은 프로덕션에서 축소 된 버전을 사용합니다.

많은 사람들이 알다시피 보석이 필요하지 않습니다.

취해야 할 단계 :

1. 부트 스트랩 다운로드
   • 직접 다운로드 링크 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

   // = 부트 스트랩 필요

그게 다입니다.새로운 멋진 부트 스트랩 템플릿을 추가 할 준비가되었습니다.

왜 app/대신vendor/ ?

파일을 다음에 추가하는 것이 중요합니다. 앱 / 자산에 하므로 나중에 부트 스트랩 스타일을 덮어 쓸 수 있습니다.

나중에 custom.css.scss사용자 지정 스타일 로 파일 을 추가하려는 경우 . 다음과 같은 내용이 있습니다 application.css.

 *= require bootstrap                                                            
 *= require custom  

부트 스트랩 파일을 app / assets 에 배치하면 모든 것이 예상대로 작동합니다. 그러나 vendor / assets 에 배치 하면 부트 스트랩 파일이 마지막에로드됩니다. 이렇게 :

<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

출력에서 앱 / 자산 이 우선하므로 먼저로드하는 것을 볼 수 있습니다 .

이 답변은 gem을 사용하지 않고 Rails 앱에 Bootstrap 3을 설치하려는 사람들을위한 것입니다. 10 분도 채 걸리지 않는 두 가지 간단한 방법이 있습니다. 귀하의 필요에 가장 적합한 것을 선택하십시오. Glyphicons와 Javascript는 작동하며 Rails 4.1.0의 최신 베타에서도 테스트했습니다.

1. Rails 4와 함께 Bootstrap 3 사용하기-Bootstrap 3 파일이 애플리케이션의 공급 업체 디렉토리에 복사됩니다.

2. CDN의 Bootstrap을 Rails 애플리케이션에 추가-Bootstrap 3 파일은 Bootstrap CDN 에서 제공됩니다 .

위의 2 번이 가장 유연합니다. 레이아웃 도우미에 저장된 버전 번호를 변경하기 만하면됩니다. 따라서 3.0.0, 3.0.3 또는 이전 Bootstrap 2 릴리스에 관계없이 원하는 Bootstrap 버전을 실행할 수 있습니다.

Twitter는 이제 gem이 포함 된 sass-ready 버전의 부트 스트랩 을 제공하므로 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 업데이트 및 후속 조치 및 필요한 경우 빠른 수정입니다.

gem bootstrap-sass

bootstrap-sass는 자산 파이프 라인을 통해 Rails에 쉽게 추가 할 수 있습니다.

Gemfile에서 bootstrap-sass gem을 추가하고 sass-rails gem이 있는지 확인해야합니다. 기본적으로 새로운 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'

새로운 부트 스트랩 버전의 최신 gem은 anjlab 형식이라고 생각합니다 .

그러나 나는 그것이 당신이 할 때 simple_form과 같은 다른 gem과 현재 잘 작동하는지 모르겠습니다 rails generate simple_form:install --bootstrap. 당신은 새로운 부트 스트랩 버전에 맞도록 일부 이니셜 라이저 나 설정을 편집해야 할 수도 있습니다.

나는 실제로 이것을 작동시키는 방법에 대해 머리를 거의 긁적 인 쉬운 해결 방법을 가지고있었습니다. 하하!

먼저 부트 스트랩 (컴파일 된 css 및 js 버전)을 다운로드했습니다.

그런 다음 모든 부트 스트랩 CSS 파일을 app/assets/stylesheets/.

그런 다음 모든 부트 스트랩 js 파일을 app/assets/javascripts/.

페이지와 왈라를 새로 고침했습니다! 방금 RoR에 부트 스트랩을 추가했습니다!