webpack 常用插件、loader汇总：

webpack 常用插件、loader汇总：

点击模块、库名字，查看使用文档

1. node常用模块汇总
2. webpack常用插件、loader汇总
3. gulp常用插件汇总
4. jQuery常用插件汇总
5. Python常用模块、库汇总

---

装载器loader

• hTML-loader ： Webpack 的 HTML 加载器模块。
• responsive-loader ： 响应式图像的加载器
• svg-url-loade ： 将 SVG 文件加载为 utf-8 编码的 Url 的加载器。
• mermaid-loader ： Webpack 的美人鱼加载模块（图表）
• wasm-loader ： Webpack 的 wasm 二进制加载器模块。
• babel-loader 使用 Babel 加载 ES2015+ 代码并将其转换为 ES5
• buble-loader 使用 Bublé 加载 ES2015+ 代码并将其转换为 ES5
• traceur-loader 使用 Traceur 加载 ES2015+ 代码并将其转换为 ES5
• ts-loader 像加载 JavaScript 一样加载 TypeScript 2.0+
• coffee-loader 像加载 JavaScript 一样加载 CoffeeScript
• fengari-loader 使用 fengari 加载 Lua 代码
• elm-webpack-loader 像加载 JavaScript 一样加载 Elm
• html-loader 将 HTML 导出为字符串，需要传入静态资源的引用路径
• pug-loader 加载 Pug 和 Jade 模板并返回一个函数
• markdown-loader 将 Markdown 编译为 HTML
• react-markdown-loader 使用 markdown-parse 解析器将 Markdown 编译为 React 组件
• posthtml-loader 使用 PostHTML 加载并转换 HTML 文件
• handlebars-loader 将 Handlebars 文件编译为 HTML
• markup-inline-loader 将 SVG/MathML 文件内嵌到 HTML 中。在将图标字体或 CSS 动画应用于 SVG 时，此功能非常实用。
• twig-loader 编译 Twig 模板并返回一个函数
• remark-loader 通过 remark 加载 markdown，且支持解析内容中的图片
• style-loader 将模块导出的内容作为样式并添加到 DOM 中
• css-loader 加载 CSS 文件并解析 import 的 CSS 文件，最终返回 CSS 代码
• less-loader 加载并编译 LESS 文件
• sass-loader 加载并编译 SASS/SCSS 文件
• postcss-loader 使用 PostCSS 加载并转换 CSS/SSS 文件
• stylus-loader 加载并编译 Stylus 文件
• vue-loader 加载并编译 Vue 组件
• angular2-template-loader 加载并编译 Angular 组件

插件plugin

名字	描述
BannerPlugin	使用 babel-minify进行压缩
CommonsChunkPlugin	提取 chunks 之间共享的通用模块
CompressionWebpackPlugin	预先准备的资源压缩版本，使用 Content-Encoding 提供访问服务
ContextReplacementPlugin	重写 require 表达式的推断上下文
CopyWebpackPlugin	将单个文件或整个目录复制到构建目录
DefinePlugin	允许在编译时(compile time)配置的全局常量
DllPlugin	为了极大减少构建时间，进行分离打包
EnvironmentPlugin	DefinePlugin 中 process.env 键的简写方式。
HotModuleReplacementPlugin	启用模块热替换(Enable Hot Module Replacement - HMR)
HtmlWebpackPlugin	简单创建 HTML 文件，用于服务器访问
I18nWebpackPlugin	为 bundle 增加国际化支持
IgnorePlugin	从 bundle 中排除某些模块
LimitChunkCountPlugin	设置 chunk 的最小/最大限制，以微调和控制 chunk
MinChunkSizePlugin	确保 chunk 大小超过指定限制
MiniCssExtractPlugin	为每个引入 CSS 的 JS 文件创建一个 CSS 文件
NoEmitOnErrorsPlugin	在输出阶段时，遇到编译错误跳过
NormalModuleReplacementPlugin	替换与正则表达式匹配的资源
NpmInstallWebpackPlugin	在开发环境下自动安装缺少的依赖
ProgressPlugin	报告编译进度
ProvidePlugin	不必通过 import/require 使用模块
SourceMapDevToolPlugin	对 source map 进行更细粒度的控制
EvalSourceMapDevToolPlugin	对 eval source map 进行更细粒度的控制
UglifyjsWebpackPlugin	可以控制项目中 UglifyJS 的版本
TerserPlugin	允许控制项目中 Terser 的版本
ZopfliWebpackPlugin	通过 node-zopfli 将资源预先压缩的版本