这是我参加【第五届青训营】笔记创作活动的第12天

什么是Webpack

webpack是前端项目工程化的具体解决方案 主要功能：它能提供友好的前端模块化开发支持，以及代码压缩混淆、处理浏览器端javaScript的兼容性、性能优化等强大的功能 好处：让程序员把工作的重心放到具体功能的实现上，提高了前端的开发效率和项目的可维护性 注意：目前Vue，React等前端项目，基本上都是基于webpack进行工程化开发的

使用webpack

关于 Webpack的使用方法，基本都围绕"配置"展开，而这些配置大致可划分为两类:

1. 流程类:作用于流程中某个or若干个环节，直接影响打包效果的配置项
2. 工具类:主流程之外，提供更多工程化能力的配置项

步骤

处理css

loader

Webpack 支持使用loader文件进行预处理。你可以构建包括 JavaScript 在内的任何静态资源。并且可以使用 Node.js 轻松编写自己的 loader，这个是官网的解释。其实webpack只认识js代码，一些不是js资源的需要通过loader编译成js，然后进行处理，保证处理模型的统一。

plugin

webpack底层用了一个叫tapable的库，通过这个库编写插件注册了一些钩子，在webpack各个工作流程种去触发这些钩子并可以通过回调函数的方式去绑定一个上下文。