简体   繁体   English

Ruby on Rails-导入Bootstrap错误“找不到文件或无法读取文件”

[英]Ruby on Rails - import Bootstrap error “File not found or unreadable”

I am new to RoR and am currently developing in a cloud IDE called Cloud9. 我是RoR的新手,目前正在开发名为Cloud9的云IDE。 I have developed an app that runs fine, but while updating my css file, out of nowhere when I launch the site I see 我已经开发了一个运行良好的应用程序,但是在更新css文件时,在启动该网站时我无处不在

Error: File to import not found or unreadable: bootstrap-sprockets.
       on line 1 of .../app/assets/stylesheets/custom.css.scss

1: @import "bootstrap-sprockets";
2: @import "bootstrap";

This appears in the top-left corner of the HTML page and I'm not sure why since all the CSS is loading properly. 这出现在HTML页面的左上角,我不确定为什么,因为所有CSS都已正确加载。 This error randomly appeared and Im not sure how to get rid of it. 该错误随机出现,我不确定如何消除它。

custom.css.scss custom.css.scss

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

/* universal */

body {
  padding-top: 60px;
}

section {
  overflow: auto;
}

textarea {
  resize: vertical;
}

.center {
  text-align: center;
}

.center h1 {
  margin-bottom: 10px;
}

/* typography */

h1, h2, h3, h4, h5, h6 {
  line-height: 1;
}

h1 {
  font-size: 3em;
  letter-spacing: -2px;
  margin-bottom: 30px;
  text-align: center;
}

h2 {
  font-size: 1.2em;
  letter-spacing: -1px;
  margin-bottom: 30px;
  text-align: center;
  font-weight: normal;
  color: #777;
}

p {
  font-size: 1.1em;
  line-height: 1.7em;
}

/* header */

#logo {
  float: left;
  margin-right: 10px;
  font-size: 1.7em;
  color: #777;
  text-transform: uppercase;
  letter-spacing: -1px;
  padding-top: 9px;
  font-weight: bold;
  &:hover {
    color: white;
    text-decoration: none;
  }
}

/* forms */

@mixin box_sizing {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

input, textarea, select, .uneditable-input {
  border: 1px solid #bbb;
  width: 100%;
  margin-bottom: 15px;
  @include box_sizing;
}

input {
  height: auto !important;
}

.checkbox {
  margin-top: -10px;
  margin-bottom: 10px;
  span {
    margin-left: 20px;
    font-weight: normal;
  }
}

#session_remember_me {
  width: auto;
  margin-left: 0;
}

Gemfile 宝石文件

source 'https://rubygems.org'

gem 'rails',        '4.2.2'
gem 'bootstrap-sass', '3.3.1'
gem 'autoprefixer-rails'
gem 'devise'
gem 'sprockets-rails'
gem 'uglifier',     '2.5.3'
gem 'coffee-rails', '4.1.0'
gem 'jquery-rails', '4.0.3'
gem 'turbolinks',   '2.3.0'
gem 'jbuilder',     '2.2.3'
gem 'sdoc',         '0.4.0', group: :doc

group :development, :test do
  gem 'sqlite3',     '1.3.9'
  gem 'byebug',      '3.4.0'
  gem 'web-console', '2.0.0.beta3'
  gem 'spring',      '1.1.3'
end

group :test do
  gem 'minitest-reporters', '1.0.5'
  gem 'mini_backtrace',     '0.1.3'
  gem 'guard-minitest',     '2.3.1'
end

group :production do
  gem 'pg',             '0.17.1'
  gem 'rails_12factor', '0.0.2'
end

在此处输入图片说明

try adding the extension to the application.js file like so: 尝试将扩展名添加到application.js文件中,如下所示:

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM