什么是webpack(项目总结)

来源:互联网 发布:中国象棋训练软件 编辑:程序博客网 时间:2024/06/10 21:43

新的项目要用vue.js 作为框架,所以就接触到了webpack,那么什么是webpack呢?首先在了解webpack之前,先了解一下什么是gulp和grunt,

1. 比如我们以前开发写很多个文件,尤其是近年来诸如coffeescript sass less jade模板以及mvc mvvm这种框架,让前端开发方便了很多。

仅以js为例,我们可能需要先把coffeescript转译成js,然后做一次语法检查,然后再压缩合并,最后才部署到生产。

gulp就是用来把上述流程自动化的,并且现在像gulp和grunt这种工具一般都提供额外的实时刷新服务器,就是说,在开发过程中监视你的文件改变,实时来帮你刷新浏览器。

前端开发越来越复杂,gulp就是把流程工具化来提高效率。

什么是Webpack

WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。

1、过去使用require和rjs等进行模块加载的方式,可以替换为webpack提供的指定loader去完成,你也可以自己开发加载特定资源的loader。
2、过去使用gulp和grunt完成项目构建优化的方式,可以替换成webpack提供的插件和特定的配置去完成。
3、由于模块的加载和项目的构建优化有机的结合,所以webpack能够更好的完成这项工作
4、并不是说有了webpack就淘汰的gulp等,有些特定的任务,还是要使用gulp去自定义完成的。但是不保证webpack的未来发展趋势会怎么样。

Webpack的工作方式是:把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个浏览器可识别的JavaScript文件。