webpack基础

在这里我仅仅的是对webpack做个讲解,webpack这个工具非常强大,解决了我们前端很繁琐的一些工具流程繁琐的事情。如果感兴趣的同学,简易还是看官网吧。

中文链接地址:https://www.webpackjs.com/

为什么要使用webpack?

现今的很多网页其实可以看做是功能丰富的应用,它们拥有着复杂的JavaScript代码和一大堆依赖包。为了简化开发的复杂度,前端社区涌现出了很多好的实践方法

  • 模块化,让我们可以把复杂的程序细化为小的文件;
  • 类似于TypeScript这种在JavaScript基础上拓展的开发语言:使我们能够实现目前版本的JavaScript不能直接使用的特性,并且之后还能转换为JavaScript文件使浏览器可以识别;
  • Scss,less等CSS预处理器
  • ...

这些改进确实大大的提高了我们的开发效率,但是利用它们开发的文件往往需要进行额外的处理才能让浏览器识别,而手动处理又是非常繁琐的,这就为WebPack类的工具的出现提供了需求。

什么是webpack

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

官网的一张图,你是否能看明白呢?

中间那个是webpack的图标,可以看作webpack这个工具。左边是我们项目生产环境下所以来的包,通过这个webpack工具我们可以打包所有的图片,所以的脚本,所有的样式等等,最后打包成了右边的静态资源文件。

注意了:每个webpack的版本都有不同的功能,而且高版本的webpack可能会出现意想不到的bug,在这里推荐大家使用2版本的webpack。

另外webpack还支持我们的模块化加载。在之前的学习可没有这个功能哦!这让我们更加快速的开发。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏木头编程 - moTzxx

Laravel 框架中对Layer的使用

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011415782/article/de...

2093
来自专栏沈唁志

在WordPress中优化谷歌(AdSense)广告联盟

很多时候我们需要将某些内容在指定的页面中显示,比如将谷歌自动广告设置为不在首页显示,这些都可以通过修改代码来达到效果

1373
来自专栏WeTest质量开放平台团队的专栏

微信小程序之提高应用速度小技巧

小程序科普类的文章已经很多了,今天这里讲的是针对小程序的优化方法,可以有效提高小程序的响应速度和用户体验。当然,开发体验也提高不少。

2.3K0
来自专栏游戏杂谈

蛋疼的flash player插件

后来,在cmd下运行chrome --allow-outdated-plugins,结果正常了,不提示了!!再双击桌面的chrome图标,也正常了!!!

1982
来自专栏二次元

正式开启全站HTTPS加密之旅

2、微语不见了 当初emlog弄上微语的时候我就感觉那是多此一举了,弄的很粗糙,但等到大家都熟悉了之后,又去掉了,未免有点。。。 其实这也能用第三方插件...

1280
来自专栏WeTest质量开放平台团队的专栏

http性能测试点滴

在服务上线之前,性能测试必不可少。本文主要介绍性能测试的流程,需要关注的指标,性能测试工具apache bench的使用,以及常见的坑。

1813
来自专栏更流畅、简洁的软件开发方式

【自然框架】添加数据的思路和流程 —— 流水线式

  自然框架里面,添加数据的思路、流程:   1、 根据元数据绘制表单。   2、 用户看到表单后就可以录入数据了。   3、 在前台使用正则来做验证。   4...

2365
来自专栏小程序的道路

微信小程序入门

登录微信,点击发现操作栏进入的页面,在页面的最下方,有个小程序,点击进去,有很多的小程序列表。对于每一个小程序,直接点击就可以使用,不需要下载。不像A...

5010
来自专栏古时的风筝

用python实现的百度新歌榜、热歌榜下载器

首先声明,本工具仅仅为学习之用,不涉及版权问题,因为百度音乐里面的歌曲本身是可以下载的,而且现在百度也提供了”百度音乐播放器”,可以通过这个工具进行批量下载。 ...

2295
来自专栏FreeBuf

反击“猫眼电影”网站的反爬虫策略

0x01 前言 前两天在百家号上看到一篇名为《反击爬虫,前端工程师的脑洞可以有多大?》的文章,文章从多方面结合实际情况列举了包括猫眼电影、美团、去哪儿等大型电商...

7185

扫码关注云+社区

领取腾讯云代金券