什么是 webpack 以及 其作用?

1.理解什么是webpack

上网搜索的直接解释是: 模块化打包机 或者 模块打包工具。
首先,认为它是一个工具,帮助我们更好的处理事情的。
其次,“打包”,如何理解? 假设我们需要寄快递。我们将许多的物品都放进了一个纸皮箱,然后进行封箱。 这就是打包。 对应到前端开发来说,就是将很多的的 css文件,js文件,图片等“物品”,全都写进一个js文件,而不是在一个html页面通过script,link标签去引入多个静态资源。
模块化,其实不同的css,不同的js就是一个模块。比如说,一个index.html,通常会有一个index.css,
一个index.js,还有其他的css,js。这些不同的文件都可以看做不同的模块。不同的模块有各自的作用。
总结来说:用这个工具,帮助我们将不同的资源和文件,进行打包,也就是合并在一个文件里面。 但是不仅仅
如此,它还附加了一些更好用的功能。
附加功能:
1.CSS 预处理。将 Less, Sass 编译成css
2.ES6 语法 转成 ES5 …(等待学习后补充)

2.作用

  • 进行重新加载编译。实际就是将浏览器不认识的语法编译成浏览器认识的语法。比如less
    编译成css,ES6 语法 转成 ES5等等。
  • 减少io请求。通常我们在请求后,会返回一个html到浏览器。这时,我们如果打开控制台,就会发现在html页面通过script,link等标签引用的静态资源, 浏览器会再次发出请求去获取这些资源。但是webpack的打包,将所有的静态资源都合并好了,减少了io请求。

持续学习中,待补充,

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值