前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >精通webpack的5大关键点

精通webpack的5大关键点

作者头像
疯狂的技术宅
发布2019-03-27 11:55:35
8350
发布2019-03-27 11:55:35
举报
文章被收录于专栏:京程一灯

京程一灯

webpack 是一个现代 JavaScript 应用程序的静态模块打包器,是目前最流行的打包神器。

什么是webpack?

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

构建就是把源代码转换成发布到线上的可执行 JavaScrip、CSS、HTML 代码,包括如下内容。

  • 代码转换:TypeScript 编译成 JavaScript、SCSS 编译成 CSS 等。
  • 文件优化:压缩 JavaScript、CSS、HTML 代码,压缩合并图片等。
  • 代码分割:提取多个页面的公共代码、提取首屏不需要执行部分的代码让其异步加载。
  • 模块合并:在采用模块化的项目里会有很多个模块和文件,需要构建功能把模块分类合并成一个文件。
  • 自动刷新:监听本地源代码的变化,自动重新构建、刷新浏览器。
  • 代码校验:在代码被提交到仓库前需要校验代码是否符合规范,以及单元测试是否通过。
  • 自动发布:更新完代码后,自动构建出线上发布代码并传输给发布系统。

构建其实是工程化、自动化思想在前端开发中的体现,把一系列流程用代码去实现,让代码自动化地执行这一系列复杂的流程。 构建给前端开发注入了更大的活力,解放了我们的生产力。

为什么你需要精通webpack?

webpack 是一个 JS 代码模块化的打包工具,藉由它强大的扩展能力及万物皆模块的概念,随着社区的发展,逐渐成为一个前端构建工具小王子,是目前最流行的打包神器。作为前端工程师,精通webpack至少可以让你的工资3000~5000元!是前端工程是必学的打包工具~

而我的webpack专题课上线一小时就突破100人购买。

我是谁?

我是志佳老师

曾就职于 百度LBS搜索研发部 腾讯MIG地图平台部

深度实践过 FIS1、2、3

经历过 Webpack 1、2、3、4 变迁

我将如何带你从0到1 精通webpack?

我的webpack教程是基于 4.x 版本,从配置到源码 深研webpack,让你可以游刃有余的配置自己的工程化环境,并深度理解webpack的整体运作流程。适合有一定前端开发经验的同学。

【webpack专题课】是5次直播大课,如果你不小心错过了直播,可以随时看回放。我将通过先点、后线、再面的方式帮你占领wepack每一个重要的阵地,并提前带你熟知使用webpack过程中会遇到的坑。

如果你报名了我的webpack专题课,我希望你能认真学完,因为它不仅仅能缓解你的知识焦虑,更重要的是让你学会实操技能,并运用到工作当中,相信你一定会成为下一个精通webpack的前端工程师。

你将学到:

基于 4.x 版本,从配置到源码 深研webpack。

  • 使用webpack快速构建SPA应用
  • 使用webpack快速构建多页应用
  • webpack在一线开发中的优化
  • webpack核心源码分析原理课
  • 手把手带你从头实现webpack
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2018-09-26,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 京程一灯 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云直播
云直播(Cloud Streaming Services,CSS)为您提供极速、稳定、专业的云端直播处理服务,根据业务的不同直播场景需求,云直播提供了标准直播、快直播、云导播台三种服务,分别针对大规模实时观看、超低延时直播、便捷云端导播的场景,配合腾讯云视立方·直播 SDK,为您提供一站式的音视频直播解决方案。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档