webpack部分面试题

1. Webpack 的构建流程主要有哪些环节？如果可以请尽可能详尽的描述 Webpack 打包的整个过程

2. Loader 和 Plugin 有哪些不同？请描述一下开发 Loader 和 Plugin 的思路。

1. 什么是loader

   loader是文件加载器，负责资源文件从输入到输出的转换（加载资源文件，并对文件进行处理【例如编译、压缩等】, 然后打包到指定文件中）；

   对于同一个资源可以依次使用多个loader，loader执行顺序类似出栈的方式，最后一个loader最先执行，第一个loader最后执行（代码中表现为：从下至上执行）；

   第一个执行loader接收源文件内容作为参数，其他loader依次接收上一个loader 处理过的内容作为参数

2. 什么是plugin

   plugin类似于一个扩展器，增强了webpack的自动化能力；

3. loader和plugin的区别

   loader：是一个转换器，将文件A编译形成文件B，这里操作的是文件

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

4. loader开发思路

   • 通过module.export 导出一个函数
   • 函数的默认参数为要处理的文件source
   • 函数体中处理资源
   • 返回处理后结果（交给下一个loader 进行处理）

5. plugin开发思路

   webpack 要求插件是一个函数或者是一个包含apply方法的对象

   • 通过钩子机制实现
   • 方法体内通过webpack提供的api获取资源做相应处理
   • 将处理完的资源通过webpack提供的方法返回