【Netlify】記事に画像を貼り付けられない

ブログサイト構築

C#のトラブルシュートのメモを残そうと思ったときに問題発生。結局、この問題を解決するのに3日かかった。。

背景

久々にブログ更新しようと、画像付きの記事を作ろうとした。

そういえば、画像付きの記事投稿は初めてだった。

課題

下記の記述で画像を表示させようとしたところ、記事の画像が表示されない。

![テキスト](path/to/image.png)

原因

途中で色々いじってしまい、問題を二重三重に重ねてしまったので当初の原因はよくわからないが、たぶん以下の原因があったと思われる。 - staticフォルダ配下に画像を入れていなかった - git lfs連携設定で、.gitattributesファイルをcommitしていなかった

対策

1. staticフォルダ配下に画像を入れる

  1. static配下にimagesフォルダを作成
  2. そこに画像ファイルを入れる
  3. 記事中で下記のように記述 ![コメント](/static/images/<file_name>.png)

2. git lfsとの連携を正しく設定する

基本、下記リンクに従って設定する。

https://www.agent-grow.com/self20percent/2019/03/18/netlify-git-lfs/

今回、どう言うわけか.gitattributesファイルが正しくcommitされていなかったようで、git lfsとnetlifyの連携がうまくできていなかった。

下記の記事を見つけて、.gitattirbutesファイルを手動で作成、コミットすることで解決。 https://css-tricks.com/getting-netlify-large-media-going/

例

特になし。

参考サイト