webpack 및 SPA에서 CSS 및 기타 리소스를 관리하는 방법

이 글은 webpack과 SPA실습에서 CSS와 기타 리소스를 관리하는 방법을 주로 소개하고 있는데, 에디터가 꽤 괜찮다고 생각해서 지금부터 공유하고 참고용으로 올려보겠습니다. 에디터를 따라가 보겠습니다

이전 글에서는 webpack을 사용하여 로컬 서비스, 자동 새로 고침, 모듈 핫 교체를 지원하는 안정적인 개발 환경을 구축하는 방법과 ES6를 사용하여 JavaScript를 작성하는 방법을 주로 소개했습니다. HTML 애플리케이션 세 가지 요소 중 또 다른 요소 – CSS 및 이미지, 글꼴 파일, 데이터 구성 파일과 같은 기타 리소스.

서문

webpack 사용법을 배울 때 webpack이 어떻게 설계되었는지, 작동 원리와 프로세스가 무엇인지에 관계없이 웹팩이 다루는 가장 기본적인 것은 HTML 태그, JavaScript, CSS, 이미지라는 점을 이해해야 합니다. , 등을 포함하며 최종 처리 결과는 DOM, JavaScript, CSS를 포함한 HTML 문서여야 합니다. CSS가 문서에 존재할 수 있는 방법에는 인라인 스타일, 인라인 스타일 및 세 가지가 있습니다. 외부 링크 스타일의 사용은 오랫동안 권장되었으므로 웹팩에서 CSS를 처리하는 방법에는 두 가지가 있습니다.

1. 인라인 스타일: