WebPack简单来说是模块打包插件：分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。

为什么要进行打包？

不得不提到 npm，npm可以说是最大的代码库注册中心，前端开发者都十分依赖它。唯一的问题是，如果不进行打包，Node 的模块系统就无法运行在 Web 上。于是，Browserify、Webpack 之类的现代 Web 打包器出现了。

作为新手，只要懂得四个核心概念即可：

入口

出口

加载器

插件

入口

入口的四种写法：

出口

项目主代码被webpack打包完，要在哪里导出呢？ 比如vue， 那就是dist，output参数里文件名和路径。

加载器

loader就是加载器，主要用于对模块的源代码进行转换。

插件

插件很好理解，常用的就是js压缩插件，css压缩打包插件，图片压缩插件…

最后

webpack是现在前端必须得会的工具之一，新手们不必一开始就从复杂的配置学起，简单入门，才能提高学习效率。

【关键词：青岛HTML5培训机构，学HTML5多少钱，HTML5培训哪家好，中享思途】