Webpack 5 => Asset Modules

Asset Modules

Webpack Asset Module

Webpack 소개 블로그

• 폰트, 아이콘 등 asset file들을 사용하기 위한 module (다른 추가 loader 필요 없이)

• Webpack 5 이전에는

  	- file을 string으로 import해주는 raw-loader

  • file을 data URI로 inline 해주는 url-loader
  • file을 output 디렉토리에 넣어주는 file-loader

• Asset Modules에는 4가지 모듈 타입이 이러한 로더들을 대체했습니다

  	- file-loader ===> asset/resource

  • url-loader ===> asset/inline
  • raw-loader ===> asset/source
  • asset은 data URI로 넣어줄지, 분리된 파일로 해줄지 자동으로 결정해줍니다

• 과거에 쓰던 file-loader, url-loader, raw-loader들은 이제 못 쓰나요??

  • type:'javascript/auto' 옵션을 주어 asset-module 대신 여전히 사용가능합니다.