Vite/Vue 3: 이미지 소스를 소품으로 사용할 때 "정의되지 않은 요구 사항"

Question

Vue CLI에서 Vite CLI로, Vue 3의 Composition API에서 SFC Script setup API로 전환했습니다.

이전에는 어떻게 효과가 있었나요

공식 Vue CLI를 사용할 때 props를 통해 경로의 파일 이름을 전달하여 이미지 소스를 가져올 수 있습니다.

으아악

그럼 다음과 같이 부르세요:

으아악

Vite로 마이그레이션한 후 오류 발생

하지만 Vite CLI로 마이그레이션한 이후로 "Uncaught ReferenceError: require is not Defined"라는 오류가 발생했습니다. 이제 내 파일은 다음과 같은 스크립트 설정 구문을 사용합니다.

으아악

내가 시도한 것

상대 경로를 사용하여 자산 폴더에서 직접 파일 가져오기를 시도했는데 제대로 작동했습니다. 하지만 import 문을 사용하여 props의 경로를 지정할 수는 없습니다.

으아악 으아악

또한 템플릿에서 import 문을 시도했지만 코드도 컴파일되지 않습니다.

으아악

뭔가 놓쳤나요? 어쩌면 이를 달성하는 데 도움이 되는 플러그인이 존재할까요?

Answer 1

저도 이 문제에 직면했습니다. 검색해서 github 이슈 댓글을 바탕으로 찾았습니다. p>

이 콘텐츠에 대한 자세한 내용은 기능 | Vite - 정적 리소스

를 참조하세요.

몇몇 검색 끝에 나에게 맞는 Vue 3 코드 예제를 찾았습니다Link 으아악 으아악