React にて、publicフォルダ内の画像を参照する

tl;dr

process.env.PUBLIC_URLもしくはwindow.location.originからpublicフォルダのパスを取得できます。

サンプル

🚀以下のサンプルは、create-react-app直後のApp.jsを編集したものです。

App.js

import React from 'react';

function App() {
  return (
    <div className="App">
        <img src={`${process.env.PUBLIC_URL}/logo192.png`} />
        <img src={`${window.location.origin}/logo192.png`} />
    </div>
  );
}

export default App;

参考

📖ReactJS and images in public folder