大家好，我是老尚，在学习webpack之前，我先列出4个问题，
<!-- 1、webpack是什么？-->
简单的说，webpack它是用于编译JavaScript的模块。也就是说，
它是一个模块打包工具。
打包工具帮你获得一些准备用于部署的js和css等，把它们转化为适合浏览器的可用的格式。
通过压缩、分享、懒加载等，来提升性能，提高开发效率。
<!-- 2、webpack不是什么？-->
它不是任务执行的工具。意思就是说，任务执行就是自动化的处理一些常见的开发任务。
例如，代码检测，构建，测试，都是一些重复性比较强的事情。
这种任务一般是偏重于上层的问题。
任务执行工具，例如，grunt、gulp。
<!-- 3、为什么要学习webpack？-->
早期，在浏览器里运行js，有二种方式，
1、直接引用js脚本程序；有多少个js，就引用多少个.js文件；
2、直接一个大的.js文件，包含所有的js代码。但是文件大小体积就不可控
后来，
又出现了使用立即执行函数表达式的（IIFE）的方式，
这种方式主要是用来解决大型项目的作用域的问题。
这种作法，有一些工具gulp、grunt，这些工具，都算是任务执行器。
它们更多做的是项目文件的拼接。
而且这类工具，它的优化代码的能力比较弱，
它很难判断某个js方法，是否被重复的引用，或是否未被引用。
再后来，
nodeJs出来了，然后就出现了JavaScript的模块化开发。
主要是引入了 require 机制，允许你在当前文件中加载和使用某个模块。
webpack最出色的功能，它还可以引入任何其它类型的文件，包括非js类型的文件，
可以用来引用应用程序中的所有的非js的内容。
例如，图片、css等，webpack把这些都视为模块，这样每个模块都可以通过相互的引用（依赖）来表明它们之间的关系，就可以避免打包未使用的模块（资源）。
这就是webpack存在的原因，也是我们为什么要学习webpack的原因。
<!-- 4、怎么学webpack？-->
【1】由浅入深，这是一个例子
-安装
-实例
-资源的管理
-输出的管理
-开发环境
-模块热替换
-生产环境
-代码分离
-懒加载
-缓存
-环境变量
-构建性能
-内容安全策略
-管理依赖
-公共路径
-...等
【2】部分、相关的概念
入口、起点、输出、模式、loader、插件、配置、模块、解析、依赖图、模块热替换等。。
【3】、相关的配置
入口和上下文、输出、模块、解析、优化、插件、构建、watch、扩展、性能、统计、loader、plugin，等。。
【4】、相关的API
模块热替换的api、loader的、plugin的相关的api等等，
<!-- loader、plugin的区别 -->
loader在webpack里用于【预处理文件】。
-文件的转换；
-json的转换
-转译
-模板
-模式
-代码检查 、测试
-框架方面的转换
plugin就是增强webpack的功能，让webpack变的更加灵活。
