React에서 styled-components로 image 넣을때..

src > img > Bg.jpg

다음 경로의 이미지를 src 파일에 있는 다른 파일이, styled-components를 이용해 background-image 속성을 사용한다고 한다면..

 

일단 import를 해와야 한다.

import Bg from './img/Bg.jpg';

라고 한 다음. styled-components에서

export const Outbox = styled.div`
    background: url(${Bg});
 `

다음과 같이 작성하면 된다.

 

사실 엄청 간단한건데.. 왜 안되는지 해메고 있었다.

아니 css는 자동으로 주소 읽어와 주던뎅..