- 文件处理的loader
file-loader
:当引入的文件是.png
、.txt
等时,可以通过file-loader
解析项目中的url
引入。根据配置将文件拷贝到相应的路径,并修改打包后文件的引入路径,让它指向正确的文件。url-loader
:url-loader
封装了file-loader
且可以不依赖于file-loader
单独使用,并且可以配置limit
。对小于limit
大小的图片转换成Base64
,大于limit
的时候使用file-loader
里的方法。
- 语法检查的loader
tslint-loader
:通过 TSLint 检查 TypeScript 代码eslint-loader
:通过 ESLint 检查 JavaScript 代码
- css处理loader
style-loader
:动态创建style
标签,将 CSS 代码插入到head
中。css-loader
:负责处理@import
、url
等语句。例如import css from 'file.css'
、url(image.png)
。postcss-loader
:负责进一步处理 CSS 文件,比如添加浏览器前缀,压缩 CSS 等less-loader
:将.less
文件内容转换成 CSS。sass-loader
:将.sass
文件内容转换成 CSS。
- JS 代码处理常见的 loader
babel-loader
:将 JS 代码向低版本转换,我们需要使用babel-loader
。ts-loader
:将 TypeScript 转换成 JavaScript