webpack常见面试题
# webpack打包原理
把所有依赖打包成bundle.js文件，通过代码分割单元片段并且按需加载
# webpack的优势
- webpack是以commonJS形式来书写脚本的，但对AMD/CMD的支持也很全面，方便旧项目进行代码迁移。
- 能被模块化的不仅仅是JS
- 开发便捷，能代替部分grunt/gulp 的工作，比如打包，压缩，混淆，图片转base64
- 拓展性强，插件丰富
# 什么事loader，plugin
loader用于加载某些资源，因为本身只能打包符合common.js文件，比如图片，css就需要相应loader加载。 plugin用于拓展webpack功能。
# 什么是bundle，chunk，module
bundle: 是由webpack打包出来的文件 chunk: 是指webpack进行模块依赖分析的时候，分割出来的代码块 module: 是开发中的单个模块
# webpack跟gulp有什么区别
webpack:
webpack是个模块打包器，强调的是一个前端模块化解决方案，更侧重模块打包，我们可以把开发中的所有资源都看成是模块， 通过loder和plugin对资源进行处理。
gulp: gulp是一个前端自动化构建工具，强调的是前端开发的工作流程，可以通过配置一系列的task，第一task处理的事情(如代码压缩，合并 编译以及浏览器事实更新等)。然后定义这些执行顺序，来让gulp执行这些task，从而构建项目的整个开发流程。自动化构建工具并不能把所有模块 都打包在一起，也不能构建不同模块之间的依赖关系。
# 什么是模热更新？有什么优点
模块热更新是webpack的一个功能，他可以使得代码修改后，不用刷新浏览器就可以更新。 在应用过程中替换添加删除模块，无需重新加载整个页面，是高级版的自动刷新浏览器。
优点： 只更新变更内容，节省开发时间，
# webpack-dev-serve 跟http服务什么区别
webpack-dev-serve 使用内存来储存webpack开发环境打包的文件，并且可以使用模块热更新，比传统http服务更有效
# 什么事长缓存？ 在webpack中怎么做到长缓存优化
浏览器在用户访问页面的时候，为了加快速度，会对用户访问的静态资源进行储存，但是每一次代码更新或者升级的时候，都需要浏览器去 下载新的代码，最方便的方式就是引入新的文件名称
在webpack中，可以在output给出输出的文件定制chunkhash，并且分离经常更新的代码和框架代码，通过NameModulesPlugin 或者HashedModulesPlugin使再次打包文件名不变。
# 什么是tree-sharking? css可以tree-sharking吗
tree-sharking是指在打包中出去那些引入了，但是在代码中没有用到的死代码。在webpack中tree-sharking是通过uglifySPlugin来 实现的，css需要Purify-css。
# 如何自动生成webpack配置
webpack-cli/vue-cli/etc...脚手架工具
# webpack打包
在生产环境中，webpack执行的时候build.js文件太大。每次请求都会消耗很大的流量，如果代码修改代码不会更新，浏览器记录了缓存。
使用readfileSync读取packege.json文件中的版本号，把获取的version(版本号)加入到output出口文件中的build.js中。