Vite 정적 파일 세팅
Vite 정적 파일 세팅
Vite React 프로젝트를 진행중 assets 폴더의 비디오 파일이 불려오지 않았다..
vite 프로젝트의 src/assets를 사용 하는 경우
import fileName from "상대경로/fileName";
const App = () => {
...
return (
<>
<video>
<source src={fileName}/>
</video>
</>
);
}
이렇게 사용하고,
vite 프로젝트의 public 폴더를 사용하는 경우
⚠️ assets 폴더를 public 밑으로 위치 시키고 절대경로로 접근해야 함.
⚠️ javascript로 mport 할 수 없다.
//* public/assets/...
const App = () => {
...
return (
<>
<video>
<source src="/assets/경로/fileName.mp4" type="video/mp4"/>
</video>
</>
);
}
이렇게 사용 하면 작동한다.
[참조1] [참조2]# Vite 정적 파일 세팅 Vite React 프로젝트를 진행중 assets 폴더의 비디오 파일이 불려오지 않았다.. ### vite 프로젝트의 src/assets를 사용 하는 경우 ```js import fileName from "상대경로/fileName"; const App = () => { ... return ( <> <video> <source src={fileName}/> </video> </> ); } ``` 이렇게 사용하고, ### vite 프로젝트의 public 폴더를 사용하는 경우 ⚠️ assets 폴더를 public 밑으로 위치 시키고 절대경로로 접근해야 함. ⚠️ javascript로 mport 할 수 없다. ```js //* public/assets/... const App = () => { ... return ( <> <video> <source src="/assets/경로/fileName.mp4" type="video/mp4"/> </video> </> ); } ``` 이렇게 사용 하면 작동한다. <a href="https://vitejs.dev/guide/assets.html#the-public-directory" target="_blank"> [참조1] </a> <a href="https://www.answeroverflow.com/m/1195197417025445959" target="_blank"> [참조2] </a>