题目描述：

webpack 中 loader 和 plugin 的区别是什么

解题：

• 思路一：

loader，它是一个转换器，将A文件进行编译成B文件，比如：将A.less转换为A.css，单纯的文件转换过程。

plugin是一个扩展器，它丰富了webpack本身，针对是loader结束后，webpack打包的整个过程，它并不直接操作文件，而是基于事件机制工作，会监听webpack打包过程中的某些节点，执行广泛的任务

• 思路二：

webpack 是由nodejs编写的前端资源加载/打包工具，由nodejs提供了强大的文件处理，IO能力。 loader: 是一个nodejs 函数模块， 传入resource file 或者sourceMap json 结果，读取文件，将文件处理为String 或者 Buffer 格式，然后传给compiler 或者下一个loader. plugin: 是能够参与到compilation process的自定义函数，通过hook到每一个编译（compiler）中，触发关键事件或处理。

如何自定义webpack插件：

JavaScript 命名函数

• 在插件函数prototype 上定义一个apply 方法
• 定义一个绑定到webpack 自身的hook
• 处理webpack内部特定数据
• 功能完成后调用webpack 提供的回调

扩展阅读：

• webpack源码学习系列之三：loader 机制
• 愿未来没有 Webpack,更没有构建工具～
• webpack源码学习系列之一：如何实现一个简单的webpack