1.认识webpack
简单来说，webpack就是一个静态资源打包工具，负责将项目中依赖的各个模块，打包成一个或多个文件。
2.核心概念
(1).依赖图 dependency graph
当webpack开始打包处理应用程序时，他会根据入口文件递归的创建一个依赖关系图（dependency graphy），之后，webpack可以通过依赖关系图取到所有非代码资源（比如图片和字体等）。
(2).入口起点 entry
entry是依赖关系图的起点。从指定的入口文件开始寻找依赖，生成关系图，完成打包构建任务。webpack允许一个或多个入口配置。分为单入口和多入口。
(3)输出output
输出则是用于控制webpack构建打包的出口，如打包的位置，打包的文件名等等。 只指定一个输出位置。
用法：在webpack中配置output属性的最低要求是，将它的值设置为一个对象，包括以下两点：
1.filename用于输出文件的文件名。
2.目标输出目录path的绝对路径。
Webpack:1.先打包生成bundle，再启动开发服务器
2.HMR时需要把改动模块及相关依赖全部编译
3.内存高效利用
4.模式mode
提供mode配置选项，告知webpack使用相应模式的内置优化。包括develpoment和production.
5.加载器loader
Webpack默认只能理解JavaScript,而其他类型资源必须使用对于应的资源loader才能处理。
例如：loader可以将文件从不同语言（如TypeScript）转换为JavaScipt,或将内联图像转换为data URL。
loader特性
6.插件plugins
插件则是用于扩展webpack的能力，目的是为了解决loader无法实现的其他事。由于插件可以携带参数/选项，你必须在webpack配置中，向plugins属性传入new实例。
7.解析resolve
reslove用于设置模块如何解析，常用配置如下：
1.alias:配置别名，简化模块引入；
2.extensions:在引入模块时可不带后缀；
3.symlinks:用于配置npm link是否生效，禁用可提升编译速度
8.优化 optimization
optimization 用于自定义webpack的内置优化配置，一般用于生产模式提升性能，常用配置项如下：
1.minimize:是否需要压缩bundle
2.minimizer:配置压缩工具，如TeraerPlugin、OptimizeCSSAssetsPlugin;
3.splitChunks:拆分bundle;
4.runtimeChunk:是否需要将所有生成chunk之间共享的运行时文件拆分出来。
标签：配置,技术,入口,loader,webpack,模块,打包 From： https://www.cnblogs.com/w-y-l-1/p/16874373.html