質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

Q&A

解決済

1回答

3172閲覧

Rails ローカル開発環境構築 *=requireが読み込めない。couldn't find file 'toastr/build/toastr.min' with type 'text/css'

YukiNakata

総合スコア20

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

0グッド

0クリップ

投稿2020/07/12 14:31

編集2020/07/12 14:33

困っていること

現在cloud9上で開発を行っているアプリをVScodeが使いたいのでローカル環境にcloneして開発を進めていこうとしているのですが、エラーメッセージにある通り、application.cssで書いている*= require hogehoge系が読み込めない状態です。
ここら辺のフロントエンドの知識が乏しく、どうすればいいのかわからない状態です。

PJでは別にcustom.css.scssというscssファイルを用意しております。

cloud9上では全く同じコードで同様のエラーは起きないのですが、何が悪いのか不明です。

おそらく、cloud9時と、local時でcssやjs, bootstrap gemなどを読み込む際のpathの違いが発生しているのかもしれませんが、原因がわかりません。

発生している問題・エラーメッセージ

イメージ説明

couldn't find file 'toastr/build/toastr.min' with type 'text/css' Checked in these paths: /Users/user_name/Desktop/PJS/pj_name/app/assets/config /Users/user_name/Desktop/PJS/pj_name/app/assets/images /Users/user_name/Desktop/PJS/pj_name/app/assets/javascripts /Users/user_name/Desktop/PJS/pj_name/app/assets/stylesheets /Users/user_name/Desktop/PJS/pj_name/vendor/assets/javascripts /Users/user_name/Desktop/PJS/pj_name/vendor/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/font-awesome-rails-4.7.0.5/app/assets/fonts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/font-awesome-rails-4.7.0.5/app/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/cocoon-1.2.14/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_db-2.3.1/app/assets/config /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_db-2.3.1/app/assets/images /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_db-2.3.1/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_db-2.3.1/app/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/swagger_ui_engine-1.1.3/app/assets/fonts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/swagger_ui_engine-1.1.3/app/assets/images /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/swagger_ui_engine-1.1.3/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/swagger_ui_engine-1.1.3/app/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/app/assets/images /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/app/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/vendor/assets/fonts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/vendor/assets/images /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/vendor/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/rails_admin-2.0.2/vendor/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/remotipart-1.4.4/vendor/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/nested_form-0.3.2/vendor/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/jquery-ui-rails-6.0.1/app/assets/images /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/jquery-ui-rails-6.0.1/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/jquery-ui-rails-6.0.1/app/assets/stylesheets /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/jquery-rails-4.4.0/vendor/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/coffee-rails-4.2.2/lib/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/actioncable-5.2.4.3/lib/assets/compiled /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/activestorage-5.2.4.3/app/assets/javascripts /Users/user_name/Users/user_name/Desktop/PJS/pj_name/vendor/bundle/gems/ruby/2.6.0/gems/actionview-5.2.4.3/lib/assets/compiled /Users/user_name/Desktop/PJS/pj_name/node_modules /Users/user_name/Desktop/PJS/pj_name/vendor/assets/fonts

該当のソースコード

application.css

css

1/* 2 *= require_self 3 *= require ace-local/application/css/rtl/bootstrap 4 *= require ace-local/application/css/ace-font 5 *= require ace-local/application/css/ace-themes 6 *= require ace-local/application/css/ace 7 8 9 *= require select2/dist/css/select2.min 10 *= require tablesorter/dist/css/theme.jui.min 11 *= require font-awesome 12 *= require toastr/build/toastr.min 13 *= require daterangepicker/daterangepicker 14 *= require bootstrap-markdown/css/bootstrap-markdown.min 15 16 *= require eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min 17 *= require fullcalendar/dist/fullcalendar.min 18 *= require custom 19 */ 20 21 22 23 24.password_tabledata{ 25 width: 180px; 26 height: 25px; 27 font-size:95%; 28} 29 30.input_password_tabledata{ 31 width: 400px; 32 position: static; 33} 34 35.input_password{ 36 -moz-box-sizing: content-box; 37 resize: none; 38 width: 380px; 39 z-index: auto; 40 height: 25px; 41 margin: 2px; 42 position: static; 43 font-size: 95%; 44} 45 46.confirm_tablerow, 47.user_info_tablerow{ 48 font-size: 95%; 49 text-align: center; 50} 51 52.fixed_width_tabledata{ 53 width: 20px; 54} 55p { 56 margin-bottom: .5rem; 57} 58.error_area{ 59 margin: 10px 0px; 60} 61.text_border{ 62 border:1px solid #bebebe; 63 border-radius:4px; 64 box-shadow: none; 65 width: 100px; 66 font-size:95%; 67 height: 25px; 68} 69 70.explanation_condition, 71.condition_input_area{ 72 font-size: 95%; 73 margin: 5px 0px 0px 0px; 74} 75 76.req_td{ 77 width: 20px; 78 padding-left: 5px; 79 padding-bottom: 5px; 80} 81 82.tablerow{ 83 height: 23px; 84} 85 86.btn_center{ 87 text-align: center; 88} 89 90

custonm.css.scss

scss

1/** bug-fix, bootstrapに合わない共通設定などはこちらへ。**/ 2 3/* select2 bug-fix: rendering width limited. */ 4 5 6{ 7 text-align: left; 8 font-size: 13px; 9} 10 11.body-container{ 12 13} 14 15.nav.navbar{ 16 17} 18 19.main-content{ 20 font-size: 15px; 21} 22 23//--------------------------------- 24 25.select2-selection__rendered { 26 width: 100% !important; 27} 28 29span.select2-container { 30 width: 100% !important; 31} 32 33/* iboxをデフォルト設定 */ 34 35.ibox { 36 margin-bottom: 0px; 37 padding: 3px; 38} 39 40.ibox-content { 41 overflow: auto; 42(省略) 434445

補足情報(FW/ツールのバージョンなど)

IDE: VScode
Ruby: 2.6.3
rails: 5.2.0

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

ローカルな必要なパッケージがなかったようです。

% brew install yarn % yarn install

で直りました。

Chromeだとsslでエラーが出ましたが設定ですかね。
Safariで繋ぐと、localhost:3000を見ることが出来ました

投稿2020/07/13 08:25

YukiNakata

総合スコア20

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問