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

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

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

Haml(HTML abstraction markup language)は、HTML/XHTMLを効率的に記述するためのマークアップ言語および記法です。

Ruby

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

Ruby on Rails

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

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

Q&A

解決済

1回答

2801閲覧

railsアプリでassetsファイルの画像が正しく表示されない

taro_san_pro

総合スコア1

Haml

Haml(HTML abstraction markup language)は、HTML/XHTMLを効率的に記述するためのマークアップ言語および記法です。

Ruby

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

Ruby on Rails

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

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

0グッド

0クリップ

投稿2020/09/08 14:11

編集2020/09/08 15:17

前提・実現したいこと

正しく画像を表示させたい

Railsでwebアプリを作っています。
トップページを作成中なのですが、添付した画像の様に表示されて画像が正しく表示されません。
イメージ説明

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

localhostの方にはエラーメッセージは表示されていないのですが、ターミナルの方には添付した画像の様に表示されています。
イメージ説明

エラーメッセージ ActionController::RoutingError (No route matches [GET] "/app/assets/images/pict/pict-reason-02.jpg"):

該当のソースコード

画像はapp/assets/images/iconに格納されています

Ruby

1 %ul.features 2 %li.features__feature 3 .feature__pic 4 %img(src="app/assets/images/icon/icon-01.png" alt="特徴1")/

試したこと

パスが違うのかもと思いいろいろ調べてみて試してみましたが何も変わりませんでした。
bacjground-imageをCSSの方で利用しているのですが、そちらは正しく表示されています。

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

ruby 2.6.5
rails 6.0.0

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

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

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

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

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

guest

回答1

0

ベストアンサー

下記でどうでしょうか。

haml

1= image_tag('icon/icon-01.png', alt: "特徴1")

投稿2020/09/08 15:19

Cojiro

総合スコア539

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

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

taro_san_pro

2020/09/08 15:31 編集

無事に表示されました…! 何故 ```Haml %img(src="app/assets/images/icon/icon-03.png" alt="特徴1")/ ``` では正しく表示されなかったのでしょうか…?
Cojiro

2020/09/08 15:52

よかったです。 私の書いたコードは、image_tagというrailsが用意してうまいことやってくれるコードで、あなたのコードは単なるhtmlです。 image_tagやアセットパイプラインあたりの理解を深めるといいと思います。
taro_san_pro

2020/09/08 15:56

回答ありがとうございます! htmlだけではrailsがうまいことやってくれないんですね 関連事項まで示していただきありがとうございました! もっと勉強頑張ろうと思います!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問