rails使用bootstrap

在Gemfile文件中添加‘bootstrap-sass‘,再运行bundle install

gem ‘bootstrap-sass‘

在config/application.rb添加一行代码,让bootstrap-sass和asset pipeline兼容

  class Application < Rails::Application
    # Settings in config/environments/* take precedence over those specified here.
    # Application configuration should go into files in config/initializers
    # -- all .rb files in that directory are automatically loaded.

    # Set Time.zone default to the specified zone and make Active Record auto-convert to this zone.
    # Run "rake -D time" for a list of tasks for finding time zone names. Default is UTC.
    # config.time_zone = ‘Central Time (US & Canada)‘

    # The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded.
    # config.i18n.load_path += Dir[Rails.root.join(‘my‘, ‘locales‘, ‘*.{rb,yml}‘).to_s]
    # config.i18n.default_locale = :de

    # Do not swallow errors in after_commit/after_rollback callbacks.
    config.active_record.raise_in_transactional_callbacks = true
    #让bootstrap-sass和asset pipeline兼容
    config.assets.precompile += %w(*.png *.jpg *.jpeg *.gif)
  end

要使用bootstrap还需要在app/assets/stylesheets目录下创建一个css文件:custom.css.scss

内容为:

@import "bootstrap-sprockets"
@import "bootstrap"

另外在app/assets/javascripts/application.js文件中添加一行

//= require bootstrap

这样才能使用bootstrap的javascript的组件。

现在就可以开始使用bootstrap了。

时间: 2024-10-24 11:39:18

rails使用bootstrap的相关文章

【转】Rails中Bootstrap的安装和使用

转自:http://blog.csdn.net/lissdy/article/details/9195651 眼看着前端攻城师们都开始使用Bootstrap创作网页,于是也想学着在最近正在学习的Rails中使用Bootstrap. 具体安装使用过程如下: 1.创建Rails工程 rails new usedschool   2.生成脚手架 rails g scaffold Item title:string description:text --skip-stylesheets 3.应用迁移 r

Rails + Bootstrap个人博客搭建的完整过程

Part 1 -首先最基本的,创建一个新的的project: rails new blog -然后修改source为https://ruby.taobao.com,加入bootstrap的gem到Gemfile: gem 'twitter-bootstrap-rails' 执行bundle install没有错误,但是有一个提示: Important: You may need to add a javascript runtime to your Gemfile in order for bo

Using Bootstrap 3 with Rails 4

转自:http://rvg.me/2013/11/using-bootstrap-3-with-rails-4/ If you are looking to use Bootstrap 3 with Rails, then this article is for you. It provides a guide to adding Bootstrap 3, aka Twitter Bootstrap 3, to a new Rails 4 project. I found this articl

ror笔记2

ror 学习笔记2 在rails app的 config 文件夹中新建unicorn.rb内容如下 worker_processes 2 working_directory "/home/mage/boleht" listen "/tmp/unicorn.boleht.sock" listen 19555, :tcp_nopush => true timeout 120 pid "/home/mage/boleht/tmp/pids/unicorn.

rails模板生成bootstrap格式的simple_form的erb文件

1.lib目录下新建 /lib/templates/erb/scaffold/_form.html.erb 模板可以生成_form.html.erb文件 <%%= simple_form_for(@<%= singular_name %>) do |f| %> <%%= f.error_notification %> <div class="col-md-6"> <div class="form-inputs"&

undefined method `environment&#39; for nil:NilClass when importing Bootstrap into rails

今天做项目时往Gemfile里加了各gem, 然后bundle update了一下, 然后悲剧了,出现了undefined method `environment' for nil:NilClass when importing Bootstrap into rails错误, 各种不理解. 然后查了一下, 找到了解决方案: https://stackoverflow.com/questions/22392862/undefined-method-environment-for-nilnilcla

Rails Bootstrap dropdown下拉菜单没反应解决方法

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #ffffff } span.s1 { } Mac环境 Rails 5.1.4 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #ffffff } span.s1 { }

Rails 101(Rails 5版) bootstrap/dropdown

让这个网站有实际"登入"."登出"的功能 练习到这个章节时出现下接菜单没有反应 这里是使用bootstrap的dropdown功能,到官方查了一下安装方法,发现缺少了一个 jQuery,我们要把他安装好,方法如下: 1.在Gemfile增加  gem 'jquery-rails' ,然后 bundle 2.app/assets/javascripts/application.js里增加 //= require jquery//= require bootstrap-

Rails bootstrap导入

创建: 2018/03/24 完成: 2018/03/24 适用于Sass, Scss. Less的自己网上搜吧 如何判断是不是Sass/Scss?项目里搜 gem 'sass-rails' ,gem里面有这个就是了  1.gem里加入bootstrap Gemfile里加上 gem 'bootstrap-sass' 然后安装 $ bundle install  2.读取bootstrap css  位置  app/assets/stylesheets/application.css  操作 1