资料内容:
1.2问题
从后端渲染的JSP. PHP,到前端原生JavaScript,再到jQuery开发,再到目前的三大框架Vue . React . Angular
开发方式,也从javascript到后面的es5 . es6、7、8、9、10,再到typescript,包括编写CSS的预处理器less . scss等
现代前端开发已经变得十分的复杂,所以我们开发过程中会遇到如下的问题:
需要通过模块化的方式来开发
使用一些高级的特性来加快我们的开发效率或者安全性,比如通过ES6+、TypeScript开发脚本逻辑,通过sass.less等方式来编写css样式代码
·监听文件的变化来并且反映到浏览器上,提高开发的效率
·JavaScript 代码需要模块化,HTML和CSS 这些资源文件也会面临需要被模块化的问题·开发完成后我们还需要将代码进行压缩、合并以及其他相关的优化
而webpack恰巧可以解决以上问题
1.3.是什么
webpack是一个用于现代JavaScript应用程序的静态模块打包工具
静态模块
这里的静态模块指的是开发阶段,可以被webpack直接引用的资源(可以直接被获取打包进 bundle.js的资源)
当webpack处理应用程序时,它会在内部构建一个依赖图,此依赖图对应映射到项目所需的每个模块(不再局限js 文件),并生成一个或多个bundle