Bootstrap Rails SCSS没有响应

Question

我刚刚进入Rails，已经遇到了很大的障碍。我从一个简单的视图开始，导航到/呈现一切正常，在桌面视图。

我有Bootstrap和Bootswatch运行，一切似乎都很好，直到我打开Chrome开发工具中的移动视口。该网站根本没有反应，但风格都在那里。

在Chrome开发工具中，媒体查询在我选择的任何视口中以media="all"的形式返回。奇怪的是，当我导航到/#，然后/时，在移动视图上，桌面视图刚刚被挤入并且不符合。

我的Gemfile：

source 'http://rubygems.org' 


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails' 
# Use sqlite3 as the database for Active Record 
gem 'sqlite3' 
# Use SCSS for stylesheets 
gem 'sass-rails' 
# Use Uglifier as compressor for JavaScript assets 
gem 'uglifier' 
# Use CoffeeScript for .coffee assets and views 
gem 'coffee-rails' 
# Use Bootswatch and Bootstrap for styling 
gem 'bootswatch-rails' 
gem 'bootstrap-sass' 
# See https://github.com/sstephenson/execjs#readme for more supported runtimes 
# gem 'therubyracer', platforms: :ruby 

# Use jquery as the JavaScript library 
gem 'jquery-rails' 
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks 
gem 'turbolinks' 
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder 
gem 'jbuilder' 
# bundle exec rake doc:rails generates the API under doc/api. 
gem 'sdoc', group: :doc 

# Use ActiveModel has_secure_password 
# gem 'bcrypt', '~> 3.1.7' 

# Use Unicorn as the app server 
# gem 'unicorn' 

# Use Capistrano for deployment 
# gem 'capistrano-rails', group: :development 

group :development, :test do 
    # Call 'byebug' anywhere in the code to stop execution and get a debugger console 
    gem 'byebug' 

    # Access an IRB console on exception pages or by using <%= console %> in views 
    gem 'web-console' 
end 

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem 
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] 

我application.css.scss：（也是它应该是.sass或.scss，我都尝试）

@import "bootstrap-sprockets"; 

@import "bootswatch/readable/variables"; 

@import "bootstrap"; 

@import "bootswatch/readable/bootswatch"; 

我的application.js：

//= require jquery 
//= require jquery_ujs 
//= require bootstrap-sprockets 
//= require turbolinks 
//= require_tree . 

任何帮助将不胜感激，我花了坚实的2小时试图让这个工作！

Answer 1

添加到这头：

<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">