Display image in public directory

悪い例

srcディレクトリ内にimageディレクトリを新規作成して、その中にxxx.pngを入れる

App.tsx内で相対パスから読み込む

<img src='../images/xxx.png'>

何が悪いのか

悪い例では画像が表示されない

Reactではビルドしたとき、全てのコンポーネントが1つのJSファイルに集約されるため、

その状態でこの相対パスをたどっても画像はない

そのため画像が表示されない

良い例

publicディレクトリ内にimageディレクトリを新規作成して、その中にxxx.pngを入れる

App.tsx内ではIndex.htmlからの相対パスを入力する

<img src='./images/xxx.png' className='AppLogo'>