- 文件处理的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