回答編集履歴

2

修正

2019/06/11 09:33

投稿

m.ts10806
m.ts10806

スコア80852

test CHANGED
@@ -1,23 +1,65 @@
1
- クは
1
+ 直接の回答ではなく、Laravelとして導入する際の注意点、デバグの仕方についてのアドバイスになっています。
2
2
 
3
- `/css/styles.css`
3
+ 他の場面でも使える考え方なので、覚えておいて損はないです。
4
-
5
- という指定の仕方のように思います。
6
-
7
- Laravel使ってるようですが、hrefはurl()を使っているのにパスを直に書いているというところで不整合起きているように思います。
8
4
 
9
5
 
10
6
 
11
- CSSは読めても画像はそこから相対パスなので正しく参照できないというのはよくある話。
7
+ # Laravel使用における外部ファイル設定
12
8
 
13
9
 
14
10
 
15
- これもデバッグ一環ですが、画像URL直に叩て実行してみるとかです
11
+ `/css/styles.css`という指定仕方ですが、Laravelでは外部ファイルを指定する際は[asset()](https://readouble.com/laravel/5.8/ja/helpers.html#method-asset)を使うやり方がより好ましいです。
16
12
 
13
+ 直書きは望ましくありません。
14
+
15
+ リンクを[url()](https://readouble.com/laravel/5.8/ja/helpers.html#method-url)で書かれているなら尚更、記法は合わせるべきでしょう。
16
+
17
+ jQueryとPureJavaScriptの記述が混ざっているような感覚に近いですが、こと、パスに関してはアプリケーションにおいては生命線なので、Laravelのように規約がしっかりあるフレームワークではなるべくフレームワークが提供する機能を利用しておいたほうが良いでしょう。
18
+
19
+ ※別の質問にて、ちょっとしたことでしたが書き方を守っていないことでバリデーションルールが正しく機能しないということがありました。
20
+
21
+
22
+
23
+ また、CSSは読めても画像はそこからの相対パスなので正しく参照できないというのはよくある話です。
24
+
25
+ ひとまず画像も含めてLaravel管理下におくのをすすめます。
26
+
27
+ 「これは直書き、これはフレームワークの機能」と記法が統一されていないと問題切り分けの妨げにしかなりません。
28
+
29
+
30
+
31
+ # 画像が表示されない時の問題切り分け
32
+
33
+
34
+
35
+ これもデバッグの一環です。
36
+
37
+
38
+
39
+ 0. 画像URL直に叩いて実行してみる
40
+
41
+ 「そこにある・なし」がすぐに分かります。画像に限らずCSSファイル、jsファイルでも有効です。
42
+
17
- あとはもっと分かりやすい画像を使ってみること。
43
+ 0. もっと分かりやすい画像を使ってみる
18
44
 
19
45
  風景写真とか動物の写真とか何かのアニメのイラストとかでもいいですが、
20
46
 
21
47
  svgにこだわらず同じ場所においてそのパスをCSSで指定する。
22
48
 
49
+ 「CSSが効かない」問題切り分けのために例えば`body{background-color:red;}`のようにして分かりやすい指定をすることで問題切り分けを行うことはよくあります。
50
+
51
+
52
+
53
+ 手元で少しでも多くの問題切り分けを行うことができるようになれば、それで解決しなくて質問することになったとしても、
54
+
55
+ 「調べたこと、試したこと」が充実したいい質問になって、回答も得やすくなり、自身のスキルアップにもつながります。
56
+
57
+ スキルアップができれば、質問する前に自身で確認できる引き出しが増え、質問する前に自分で解決できるようになります。
58
+
59
+
60
+
61
+ 「調べるより聞くほうが早い」という言葉、実は自身の成長の弊害となっていることが多いです。
62
+
63
+ 質問を書くこと、質問の不備を指摘されて修正すること、やり取りによって解決すること、実は非常にハイコストです。自身だけではなく回答やアドバイスを送ってくれる相手の時間を使うことになります。
64
+
23
- そうしたらまた1つ問題切り分けができます。
65
+ でも早く、「自分でやっほう早い」になるといいです

1

低評価つけるほどの内容ですか?理由をコメントしてくださいね。なければ質問者を通報します。

2019/06/11 09:33

投稿

m.ts10806
m.ts10806

スコア80852

test CHANGED
File without changes