エラーを修正する方法：Ruby on Railsの "Sass :: SyntaxError in Posts＃index"を修正しますか？

私はチュートリアルを読んで私のRailsアプリケーションにブートストラップを追加しようとしていましたが、私は以下のエラーを受け取りました。何が起こったのか説明してください。修正する方法を示すために自分のコードを編集してください。そして、あなたが参照するRails上のすべてのリソースは、それをよりうまく利用できるようになります。 P.私はちょうど始まっている。読んでいただきありがとうございます。：Dエラーを修正する方法：Ruby on Railsの "Sass :: SyntaxError in Posts＃index"を修正しますか？

：

ページ：のhttp // localhostを：3000 /ポスト

エラー：ファイルの

Sass::SyntaxError in Posts#index

File to import not found or unreadable: bootstrap. Load paths:
/Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/app/assets/config /Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/app/assets/images /Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/app/assets/javascripts
/Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/app/assets/stylesheets
/Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/vendor/assets/javascripts
/Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training/vendor/assets/stylesheets
/Users/mac/.rvm/gems/ruby-2.3.0/gems/jquery-rails-4.2.1/vendor/assets/javascripts /Users/mac/.rvm/gems/ruby-2.3.0/gems/coffee-rails-4.2.1/lib/assets/javascripts /Users/mac/.rvm/gems/ruby-2.3.0/gems/actioncable-5.0.0.1/lib/assets/compiled /Users/mac/.rvm/gems/ruby-2.3.0/gems/turbolinks-source-5.0.0/lib/assets/javascripts

Extracted source (around line #5): 


// @import "bootstrap-responsive"; 

@import "bootstrap"; 
@import "bootstrap-responsive"; 

// body {

Rails.root: /Users/mac/Documents/Projects/Web Development/Ruby On Rails/Jump Start Rails/training

Application Trace | Framework Trace | Full Trace app/assets/stylesheets/custom.css.scss:5 app/views/layouts/application.html.erb:7:in `_app_views_layouts_application_html_erb___3077022213198936014_70226475759060' Request

Parameters:

None

Toggle session dump Toggle env dump Response

Headers:

None

Gitのレポ：https://github.com/ScarletMcLearn/training

のコード"application.html.erb" ファイル（必要な場合）：

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Training</title> 
    <%= csrf_meta_tags %> 

    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> 
    </head> 

    <body> 
    <%= yield %> 
    </body> 
</html>

application.jsファイルのコード（必要な場合）：Gemfileの

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. JavaScript code in this file should be added after the last require_* statement. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require jquery 

// = require bootstrap-sprockets 

//= require jquery_ujs 
//= require turbolinks 
//= require_tree . 


//= require bootstrap

内容：

source 'https://rubygems.org' 


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '~> 5.0.0', '>= 5.0.0.1' 
# Use sqlite3 as the database for Active Record 
gem 'sqlite3' 
# Use Puma as the app server 
gem 'puma', '~> 3.0' 
# Use SCSS for stylesheets 
gem 'sass-rails', '~> 5.0' 
# Use Uglifier as compressor for JavaScript assets 
gem 'uglifier', '>= 1.3.0' 
# Use CoffeeScript for .coffee assets and views 
gem 'coffee-rails', '~> 4.2' 
# See https://github.com/rails/execjs#readme for more supported runtimes 
# gem 'therubyracer', platforms: :ruby 

# Use jquery as the JavaScript library 
gem 'jquery-rails' 
# 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' 
# Use Redis adapter to run Action Cable in production 
# gem 'redis', '~> 3.0' 
# Use ActiveModel has_secure_password 
# gem 'bcrypt', '~> 3.1.7' 
gem 'bootstrap-sass' 


# 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', platform: :mri 
end 

group :development do 
    # Access an IRB console on exception pages or by using <%= console %> anywhere in the code. 
    gem 'web-console' 
    gem 'listen', '~> 3.0.5' 
    # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring 
    gem 'spring' 
    gem 'spring-watcher-listen', '~> 2.0.0' 
end 

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

マイ "application.css" ファイル：

/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the bottom of the 
* compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS 
* files in this directory. Styles in this file should be added after the last require_* statement. 
* It is generally better to create a new file per style scope. 
* 
*= require_tree . 
*= require_self 
*/

私の "custom.css.scss" ファイル：

// @import "bootstrap"; 

// @import "bootstrap-responsive"; 

//=reqire_self 

@import "bootstrap"; 
@import "bootstrap-responsive"; 

// body { 
//  padding-top: 60px; 
//  padding-bottom: 40px 
// } 
// .sidebar-nav { 
//  padding: 9px 0; 
// } 


body { 
    padding-top: 60px; 
    padding-bottom: 40px; 
} 
.sidebar-nav { 
    padding: 9px 0; 
}

私の 'application.js' ファイル：

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. JavaScript code in this file should be added after the last require_* statement. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require jquery 

// = require bootstrap-sprockets 

//= require jquery_ujs 
//= require turbolinks 
//= require_tree . 


//= require twitter/bootstrap

マイGemfile：

source 'https://rubygems.org' 


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '~> 5.0.0', '>= 5.0.0.1' 
# Use sqlite3 as the database for Active Record 
gem 'sqlite3' 
# Use Puma as the app server 
gem 'puma', '~> 3.0' 
# Use SCSS for stylesheets 
gem 'sass-rails', '~> 5.0' 
# Use Uglifier as compressor for JavaScript assets 
gem 'uglifier', '>= 1.3.0' 
# Use CoffeeScript for .coffee assets and views 
gem 'coffee-rails', '~> 4.2' 
# See https://github.com/rails/execjs#readme for more supported runtimes 
# gem 'therubyracer', platforms: :ruby 

# Use jquery as the JavaScript library 
gem 'jquery-rails' 
# 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' 
# Use Redis adapter to run Action Cable in production 
# gem 'redis', '~> 3.0' 
# Use ActiveModel has_secure_password 
# gem 'bcrypt', '~> 3.1.7' 
gem 'bootstrap-sass' 

gem 'sass-rails', '~> 5.0' 

gem 'twitter-bootstrap-rails' 

# 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', platform: :mri 
end 

group :development do 
    # Access an IRB console on exception pages or by using <%= console %> anywhere in the code. 
    gem 'web-console' 
    gem 'listen', '~> 3.0.5' 
    # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring 
    gem 'spring' 
    gem 'spring-watcher-listen', '~> 2.0.0' 
end 

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

出典

2016-09-12 Scarlet McLearn

は愚かに聞こえるが、あなたはサーバーを停止し、再起動しようとしていますか？ – GhostRider

：pいいえ、私はいませんでした。しかし、今は試しましたが、役に立たない。 :( @GhostRiderいくつかの更新を与えています。 –

あなたはgithubのためにレポをアップロードすることができますか？これは私がそれ試合知らない – stephenmurdoch

あなたに以下を追加しましたGemfileとそれ以降はbundle installを実行しますか？

gem 'bootstrap-sass', '~> 3.3.6' 
gem 'sass-rails', '>= 3.2'

rails

スタイルシート、JavaScriptと画像を含むプリプロセス資産、ためにsprocketsフレームワークを使用します。前処理中に@import "bootstrap";が発生すると、アセットパスディレクトリを通過して、インポートされたブートストラップディレクトリまたはファイルを検索します。あなたが遭遇しているエラーに基づいて、sprocketsエンジンがbootstrapを見つけることができないように見えます。

Gemfileにbootstrap-sassを含めて、bundle installを実行して、エラーが消えるかどうかを確認してください。

application.css.scss

/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the bottom of the 
* compiled file so the styles you add here take precedence over styles defined in any styles 
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new 
* file per style scope. 
* 
*= require_self 
*/

アプリケーション：

出典

2016-09-12 16:56:13 Dharam

@stephenmurdoch ...私がやっているの感覚を。私は前にそれらを追加してもバンドルがインストール走り、このエラーを得た。私はGemfileを編集して、コメントを追加しますカント示唆ください。 –

あなたのように見えます'Gemfile''で定義されてspring'ている。あなたは 'Gemfile'は、サーバーを再起動する前に拾っへの変更のためのために、'バンドルのexecスプリングstop'を使用して、それを停止していることを確認してください。 – Dharam

私は、ターミナルで次のコマンドを実行し、また再起動私のサーバー。そのsti同じです@Dharam :( –

はこれを行います。CSS

/* 
* This is a manifest file that'll automatically include all the stylesheets available in this directory 
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at 
* the top of the compiled file, but it's generally better to create a new file per style scope. 
*= require_self 
*= require_tree . 
*/

Application.jsその特定のために

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. 
// 
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
//= require jquery 
//= require jquery_ujs 
//= require twitter/bootstrap 
//= require turbolinks

！

Gemfile.rb

gem 'sass-rails', '~> 5.0' 
gem 'twitter-bootstrap-rails'

は、任意のグループの外に、あなたはgemfileでこれらの2つの宝石を持っていることを確認してください。そして、実行bundle install

出典

2016-09-12 17:10:52 luissimo

私も以前に行ったことがありますが、コードをアップロードしましたが、それと同じ問題です –

"bootstrap"をインポートしようとしましたか？ import "bootstrap-responsive"; '= bootstrap-sprocketsが必要です' – luissimo

はい、私はしましたが、変更はありません：<@luissimo –

エラーを修正する方法：Ruby on Railsの "Sass :: SyntaxError in Posts＃index"を修正しますか？

答えて

関連する問題