一：什么是webpack和grunt和gulp有什么不同（code-splitting，懒加载和缓存都没有实际操作过，热更新已经手动操作过，现在先把概念弄明白，然后就开始看es6）
Webpack是一个模块打包器，他可以递归的打包项目中的所有模块，最终生成几个打包后的文件。他和其他的工具最大的不同在于他支持code-splitting、模块化(AMD，ESM，CommonJs)、全局分析。
code-splitting可以用于两个方面，一个是抽取公共代码，另一个是懒加载，其中和抽取公共代码的有：多个入口，或者使用CommonsChunkPlugin 或者是SplitChunkPlugin，和懒加载（也就是按需加载）有关的是：require.ensure（）；
HtmlWebpackPlugin has created an entirely new file for you and that all the bundles are automatically added.
二：什么是bundle,什么是chunk，什么是module?
bundle是由webpack打包出来的文件，chunk是指webpack在进行模块的依赖分析的时候，代码分割出来的代码块。module是开发中的单个模块。
三：什么是Loader?什么是Plugin?（什么是apply方法，这个更是不明白，比较深入的知识点）
1）Loaders是用来告诉webpack如何转化处理某一类型的文件，并且引入到打包出的文件中 2）Plugin是用来自定义webpack打包过程的方式，一个插件是含有apply方法的一个对象，通过这个方法可以参与到整个webpack打包的各个流程(生命周期)。
extract-text-webpack-plugi：从打包的js文件中抽出特定的text到一个单独的文件中。
配置问题:如何可以自动生成webpack配置？
webpack-cli /vue-cli /etc ...脚手架工具
1：webpack-dev-server和http服务器如nginx有什么区别?
webpack-dev-server使用内存来存储webpack开发环境下的打包文件，并且可以使用模块热更新，他比传统的http服务对开发更加简单高效。
2:什么 是模块热更新？
模块热更新是webpack的一个功能，他可以使得代码修改过后不用刷新浏览器就可以更新，是高级版的自动刷新浏览器。
它的好处是：1.可以维持程序现在的状态，这个状态如果浏览器刷新的话 就会变没了；2.节省大量的开发时间；
**优化一：什么是长缓存？在webpack中如何做到长缓存优化？
浏览器在用户访问页面的时候，为了加快加载速度，会对用户访问的静态资源进行存储，但是每一次代码升级或是更新，都需要浏览器去下载新的代码，最方便和简单的更新方式就是引入新的文件名称。在webpack中可以在output纵输出的文件指定chunkhash,并且分离经常更新的代码和框架代码。通过NameModulesPlugin或是HashedModuleIdsPlugin使再次打包文件名不变。
一张方式是通过抽取manifest data的数据的方式，因为manifest data的数据每次打包的时候都会改变，从而影响数据文件的缓存优化。
Manifest 文件主要是用来模块之间的交互 ，Using the data in the manifest, the runtime will be able to find out where to retrieve the modules behind the identifiersAs the compiler enters, resolves, and maps out your application, it keeps detailed notes on all your modules.
Runtime 主要是懒加载的功能，以及load和resolve的功能代码It contains the loading and resolving logic needed to connect your modules as they interact. This includes connecting modules that have already been loaded into the browser as well as logic to lazy-load the ones that haven't.
By using content hashes within your bundle file names, you can indicate to the browser when the contents of a file has changed thus invalidating the cache. Once you start doing this though, you'll immediately notice some funny behavior. Certain hashes change even when their contents apparently do not. This is caused by the injection of the runtime and manifest which changes every build.
**优化二：什么是Tree-shaking?CSS可以Tree-shaking吗
**
Tree-shaking是指在打包中去除那些引入了，但是在代码中没有被用到的那些死代码。在webpack中Tree-shaking是通过uglifySPlugin来Tree-shaking JS。Css需要使用Purify-CSS。
常用的插件：(压缩插件->uglifyjs-webpack-plugin，自动加载模块）
在介绍entry的时候，提到chunk的概念，chunk指的就是一个代码块，即一个js文件。默认情况下webpack只产生entry中制定的代码块，chunk的个数和entry中的key值个数相等，即单入口的情况下，默认只产出一个chunk，但是我们通常希望将入口之间的通用代码和第三方类库的代码提取出来，单独作为一个js文件来引用，第三方的文件一般很少变动，可以利用缓存机制把相关内容缓存起来，通用代码则可以便面重复加载
commonChunkPlugin的处理级别是chunk级别，通过指定chunks+minChunks（提取过滤器：一般是被引用的次数）+name（输出的文件名）来完成操作。
文件间的关系处理
module构建阶段：将文件通过loaders+module转化为模块化文件
模块化文件通过plugins+entry提取，合并成chunks文件，
然后再通过plugins 生产产出文件
