随着前端工程越来越复杂,单独建几个文件写业务代码,这样的方式已经无法保证项目的可维护性了。

所以我们就想把不同的逻辑拆成模块,然后分开引入这些模块,每个模块自己做自己的事情,这样就可以保证项目的可维护性和拓展行。

假如你有几千个模块,那你能在页面引入几千个文件吗,所以当项目大到这个程度的时候,我们就得借助工具来维护我们这些模块了。webpack就是这样一种工具,帮助我们管理复杂项目的一个工具。

与webpack类似,还有很多相似的工具,比如gulp,grunt,browserify。但是这两年webpack的使用率直线上升。比如vue,react,angular。三个脚手架工具,都开始使用webpack底层代码的构建。这得益于webpack相对其它工具无法实现的一些特性。
比如tree shaking,懒加载,代码分割...
不会webpack,不影响业务代码的实现,学会了webpack,你会更深一层去思考前端工程化上面的内容。也能发现在代码的背后其实别有洞天。学会webpack,将极大的扩充前端的开发视野。

webpack4相对于之前的版本有了较大的变化。他的速度更快,大型项目节约90%构建事件,同时内置了更多默认配置,变更了许多api。