QH-Jimmy

摘要： 经过非常非常长无聊的流程，只是将获取到的module信息做了一些缓存，然后生成了loaderContext对象。 这里上个图整理一下这节的流程： 这一节来看webpack是如何将babel-loader与js文件结合的，首先总览一下runLoaders函数： 传入的4个参数都很直白： 1、待处理文件 阅读全文

摘要： 赶紧完结这个系列咯，webpack4都已经出正式版了。 之前的代码搜索到js文件的对应loader，并添加到了对象中返回，流程如下： 这个对象的request将入口文件的路径与loader拼接起来并用！分割，所有的属性基本上都与路径相关。 after-resolve事件流 这里会触发after-re 阅读全文

摘要： 眼看webpack4都出了，我还在撸3的源码，真的是捉急啊…… 不过现在只是beta版本，等出稳定版本后跑跑4的源码去。 之前漏了一个东西没有讲，如下： 在解析完入口文件路径与JS文件对应的babel-loader路径后，返回的包装对象多了一个parser属性，看似简单，实则麻烦的要死。 这里的参数 阅读全文

摘要： 哈哈，上首页真难，每次都被秒下，心疼自己1秒~ 这里补充一个简要图，方便理解流程： 在处理./input.js入口文件时，在类型判断被分为普通文件，所以走的文件事件流，最后拼接得到文件的绝对路径。 但是对应"babel-loader"这个字符串，在如下正则中被判定为模块类型： 因此，参考第33节的流 阅读全文

摘要： 新年好呀~过个年光打游戏，function都写不顺溜了。 上一节的代码到这里了： 经过长长的resolve，最终也只是解析入口文件的合法路径信息，然后调用回调函数。 接下来分析回调函数是如何处理返回结果的： 返回的结果有两部分，一个是loader，一个是文件对应路径。 对于入口文件的当前解析，不存在 阅读全文

摘要： 最近不小心更新了element-ui的版本，已经到了2.1.0，以前修改的源码都失效了。 于是重新尝试下面的指令重新修改： 这时候会发现，不仅npm run dist的eslint日常报错，连npm install都报错了，不过是普通的operation not permitted，用管理员权限运行 阅读全文

摘要： file => FileExistsPlugin 这个事件流快接近尾声了，接下来是FileExistsPlugin，很奇怪的是在最后才来检验路径文件是否存在。 源码如下： 这里只是简单的对路径文件进行状态获取，然后判断是否存在？是否是文件？最后调用一个有message的doResolve方法进入到下 阅读全文

摘要： 流程图如下： 重回DescriptionFilePlugin 上一节最后进入relative事件流，注入地点如下： 这似曾相识的感觉，这不就是解析package.json的插件么，又调用了一次。 但是有一点点微妙的不同，第一次调用该插件时，request对象如下所示： 在经过几个插件的洗礼后，变成了 阅读全文

摘要： 放个流程图： 这里也放一下request对象内容，这节完事后如下(把vue-cli的package.json也复制过来了)： 上一节看到这： 这里接下来会调用runAfter方法，之前有讲解过这个，简单讲就是触发after-type的事件流，这里的type为parsed-resolve，即触发aft 阅读全文

摘要： 这里所有的插件都对应着一个小功能，画个图整理下目前流程： 上节是从ParsePlugin中出来，对'./input.js'入口文件的路径做了处理，返回如下： 该插件调用完后，进入下一个事件流，开始跑跑parsed-resolve相关的了。 回头看了一眼28节的大流程图，发现基本上这些事件流都是串联起 阅读全文