CRA로 만든 리액트 프로젝트에서 public 폴더 이미지 사용하기

CRA로 만든 리액트 앱은 src 경로 밖에 접근할 수 없다.

때문에 import를 통해 public 폴더에 접근하기 어렵다.

src 폴더 안에 이미지 파일을 넣으면 되지만 구조적으로 마음에 들지 않는다.

public 폴더 안에 img 폴더를 만들고 이미지 파일을 넣는다.

import 대신 background-image나 img src=""를 사용하기로 한다.

경로가 public/img/image.png면

<img src="/img/image.png" />

background-image: url("img/image.png");

두 방법으로 이미지를 가져올 수 있다.

React 프로젝트에서 이미지 import하는 방법