choi95의 TIL📝

https://choi95.tistory.com/131 favicons-Webpack-plugin을 통해 favicons 이미지 적용하기 문제 프로젝트 도중 Webpack을 통해 번들링 된 결과물을 서버에 띄우니 html head 태그 내에 적용했던 favicons 이미지가 적용되지 않는 문제가 발생하였다. favicons 이미지에 사용되는 소스의 확장자는 choi95.tistory.com 이전 포스팅에서 meta 데이터에 파비콘 이미지 소스를 patch하기 위해 favicons-webpack-plugin을 사용하였다. 하지만 다음과 같이 크게 2가지 원인으로 이를 copy-webpack-plugin으로 대체하기로 하였다. 테스트 용도로 지정한 favicon 이미지가 path를 수정하여도 그대로 웹 상에..

문제 프로젝트 도중 Webpack을 통해 번들링 된 결과물을 서버에 띄우니 html head 태그 내에 적용했던 favicons 이미지가 적용되지 않는 문제가 발생함과 동시에 다음과 같은 에러가 발생하였다. MIME type ('text/html') is not a supported stylesheet MIME type 해당 에러에 대해서 검색을 해보니, https://stackoverflow.com/questions/55178482/mime-type-text-html-is-not-a-supported-stylesheet-mime-type MIME type ('text/html') is not a supported stylesheet MIME type I have tried almost every sol..

문제 css-loader를 통해 css 파일을 읽어서 JS string 형식으로 변환한 뒤에 html 파일에 적용시켜 주기 위해 style-loader를 사용하였다. 하지만 js 상에서 해당 css파일을 객체로 import 하여 스타일을 적용하는 과정은 성공하였지만 html 파일에 클래스가 부여된 태그들은 해당 css파일의 스타일이 적용되지 않는 문제가 발생하였다. 문제 해결 해당 style 태그는 style-loader에 의해 동적으로 생성되어 이후에 html에 추가되었고 이에 대한 결과는 개발 창을 열어 확인한 것이다. style 태그를 살펴 보면 body와 같이 태그명 선택자는 css파일에 저장되어 있는 그대로 출력되는 반면 클래스명 선택자와 같은 경우는 원래의 클래스명이 아닌 이상한 코드명과 같은..