img tag src 경로 지정 (절대/상대)

Darcy Daeseok YU ·2022년 2월 12일
0
post-custom-banner

아이콘으로 쓸 img 소스를 불러오는데 경로가 안맞다.

결론 :

절대경로 :
jsx 파일 내에서는 절대경로 폴더는 pulic
css 파일 내에서 절대경로 폴더는 src

wtf ...

─ public
└ public_img

public 경로 아래에 img폴더를 생성한다.

jsx 파일에서는 아래와 같이 사용가능하다. !important
(o)

<img src="./public_icons/Java.png" alt="" />
<img src="public_icons/Java.png" alt="" />

src폴더에 있는 이미지는 불러오지 못한다.
(x)

<TechImg src="./src_icons/Java.png" alt="" />

─ src
└ src_img

jsx파일에서 src 폴더에 있는 이미지를 불러오자.
상대경로로 불러온다.
절대경로(x)
아래는 정상 동작한다.

<img src={require("../../src_icons/OracleDBMS.png")} alt="" />

아래는 에러가 난다.
절대/상대경로 모두 import가 안된다.
(x)

import path from "../../src_icons/OracleDBMS.png";
profile
React, React-Native https://darcyu83.netlify.app/
post-custom-banner

0개의 댓글