首页
首页
沸点
课程
直播
活动
竞赛
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
webpack 系列
订阅
leto
更多收藏集
微信扫码分享
微信
新浪微博
QQ
12篇文章 · 0订阅
webpack系列之四loader详解2
上篇文章主要讲了 loader 的配置,匹配相关的机制。这篇主要会讲当一个 module 被创建之后,使用 loader 去处理这个 module 内容的流程机制。首先我们来总体的看下整个的流程: 在 module 一开始构建的过程中,首先会创建一个 loaderContext…
webpack系列之四loader详解1
2 种不同的配置形式,在 webpack 内部有着不同的解析方式。此外,不同的配置方式也决定了最终在实际加载 module 过程中不同 loader 之间相互的执行顺序等。 在讲 loader 的匹配过程之前,首先从整体上了解下 loader 在整个 webpack 的 wor…
窥探原理:手写一个 JavaScript 打包器
所有的内容之后会陆续放出,如果你有任何想要了解的内容或者有任何疑问,关注公众号【前端瓶子君】回复【123】添加好友,我会解答你的疑问。 作为一个前端开发人员,我们花费大量的时间去处理 webpack、gulp 等打包工具,将高级 JavaScript 项目打包成更复杂、更难以解…
【webpack进阶】前端运行时的模块化设计与实现
webpack是一个强大而复杂的前端自动化工具。其中一个特点就是配置复杂,这也使得「webpack配置工程师」这种戏谑的称呼开始流行🤷但是,难道你真的只满足于玩转webpack配置么? 显然不是。在学习如何使用webpack之外,我们更需要深入webpack内部,探索各部分的…
webpack系列之七-文件生成
经过前几篇文章我们介绍了 webpack 如何从配置文件的入口开始,将每一个文件转变为内部的 module,然后再由 module 整合成一个一个的 chunk。这篇文章我们来看一下最后一步 —— chunk 如何转变为最终的 js 文件。 上篇文章主要是梳理了在 seal 阶…
webpack系列之六chunk图生成
这篇文章主要是通过源码去探索下 webpack 是如何通过在编译环节创建的 module graph 来生成对应的 chunk graph。 我们都知道 webpack 打包构建时会根据你的具体业务代码和 webpack 相关配置来决定输出的最终文件,具体的文件的名和文件数量也…
webpack系列之五module生成2
在上一篇 module生成1中我们已经分析了 webpack 是如何根据 entry 配置找到对应的文件的,接下来就是将文件转为 module 了。这个长长的过程,可以分成下面几个阶段 create: 准备数据,生成 module 实例。 add: 信息保存到 Compilat…
webpack系列之五module生成1
对于 webpack 来说每个文件都是一个 module,这篇文章带你来看 webpack 如何从配置中 entry 的定义开始,顺藤摸瓜找到全部的文件,并转化为 module。 webpack 入口 entry,entry 参数是单入口字符串、单入口数组、多入口对象还是动态函…
webpack系列之四loader详解3
前2篇文章:webpack loader详解1和webpack loader详解2主要通过源码分析了 loader 的配置,匹配和加载,执行等内容,这篇文章会通过具体的实例来学习下如何去实现一个 loader。 这里我们来看下 vue-loader(v15) 内部的相关内容,这…
webpack系列之三resolve
webpack 的特点之一是处理一切模块,我们可以将逻辑拆分到不同的文件中,然后通过模块化方案进行导出和引入。现在 ES6 的 Module 则是大家最常用的模块化方案,所以你一定写过 import './xxx' 或者 import 'something-in-nodemod…