현재 몇 개의 SVG 이미지와 배경 이미지가 필요한 webpack 5 프로젝트가 있습니다. svg 이미지는 template.html 파일로 인코딩됩니다. 배경 이미지는 style.css 파일에서 참조됩니다. 빌드를 실행하면 웹 페이지에 이미지가 빌드되지 않습니다. 파일 로더 테스트에서 사용자 정의 이름을 사용하더라도 해시 형식으로 유지됩니다.
현재 웹팩 구성 파일은 다음과 같습니다.
으아아아여기 svg가 어떻게 구현되는지 보여주는 스니펫이 있습니다
으아아아마지막으로 프로그램이 구축된 이미지는 다음과 같습니다. 구축 중 이미지 오류
파일 로더 형식을 사용해 본 적도 있고 제거해 본 적도 있습니다. 내 파일 구조는 다음과 같습니다:
파일 구조
오류가 발생하지 않습니다. 이미지는 번들 코드에는 표시되지만 해시된 형식으로 표시되며 라이브 웹사이트에는 표시되지 않습니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
html-loader와 html webpack 플러그인이 필요합니다. 해시된 이름으로 html 파일을 다시 작성합니다.
으아악svg 규칙을
로 바꿉니다. 으아악