将Bootstrap集成到Ruby on Rails 5.1.4中

时间:2017-10-15 21:24:08

标签: css ruby-on-rails twitter-bootstrap

我正在尝试将bootstrap集成到ruby中,但没有成功。

我正在使用以下宝石:

git_source(:github) do |repo_name|
  repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/")
  "https://github.com/#{repo_name}.git"
end
gem 'sass-rails', '~> 5.0'
gem 'bootstrap-sass', '3.3.7'
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.1.4'
# Use postgresql as the database for Active Record
gem 'pg', '~> 0.18'
# Use Puma as the app server
gem 'puma', '~> 3.7'
# Use SCSS for stylesheets

# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# See https://github.com/rails/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'

已将@import "bootstrap-sprockets"; @import "bootstrap";导入我的custom.scss文件。

我希望Bootstraps能够开始发挥其魔力,但一切都没有发生。 谢谢你的帮助!

4 个答案:

答案 0 :(得分:2)

Rails 5.1.4没有内置的jquery,但Bootstrap的功能仍然需要jQuery。

确保在 Gemfile 中包含jquery gem和bootstrap gem。

# Gemfile
gem 'jquery-rails', '~> 4.3.1'
gem 'bootstrap', '~> 4.0.0.beta'

另外,请确保将以下内容添加到 app / assets / javascripts / application.js

//= require jquery
//= require popper
//= require bootstrap

jQuery和Popper是Bootstrap 4的依赖项。阅读更多https://getbootstrap.com/docs/4.0/getting-started/webpack/#importing-javascript

希望这有帮助!

答案 1 :(得分:1)

您是否添加了以下内容?

需要app/assets/javascripts/application.js

中的Bootstrap Javascripts
//= require jquery
//= require bootstrap-sprockets

答案 2 :(得分:1)

您需要在Gemfile中添加gem “jquery-rails”,然后在 application.js 文件中添加//= require jquery //= require jquery_ujs //= require bootstrap-sprockets。另外,不要忘记运行bundle install after you add your gem.

答案 3 :(得分:0)

就我而言,它在Gemfile中添加了这一行之后就可以了。 sprockets 4.0版本中应该有一些重大更改。

gem 'sprockets', '~> 3.7.2'

除此之外,我按照这里的说明https://github.com/twbs/bootstrap-sass#a-ruby-on-rails“如果您正在使用Rails 5.1+ ...”部分。