先看上一节的_create函数 _create(type, resolveOptionsWithDepType) { const originalResolveOptions = { ...resolveOptionsWithDepType }; const resolveOptions = convertToResolveOptions( this.hooks.resolveOptions.for(type).call(resolveOptionsWithDepType) ); const resolver = Factory.createResolver(resolveOptions) c...

compiler.hooks.initialize.call();createComplier 就剩下这一个函数了，这个initialize默认没有事件，所以直接返回，那我们回顾一下每个函数都做了什么。 const createCompiler = rawOptions => { const options = getNormalizedWebpackOptions(rawOptions); applyWebpackOptionsBaseDefaults(options); const compiler = new Compiler(options.context, options); ...

这一章我们先给一个demo，从demo的视角讲解，new WebpackOptionsApply().process(options, compiler);都发生了什么。先上demo首先第一步，把webpack源码clone下来, git clone https://github.com/webpack/webpack.git然后执行yarn，把npm包下载下来，然后mkdir demo 创建一个demo文件夹，文件夹内部创建一个webpack.js文本就是下方的内容 var path = require("path"); var webpack = require(&qu...

上一章，讲到了applyWebpackOptionsDefaults，它是用来给webpack赋值的，如果你不传值，那我就自己来复默认值，然后我们接着分析。compiler.hooks.environment.call();compiler.hooks.afterEnvironment.call();接下来执行两个hooks，默认情况下，webpack并没有environment的事件，所以即使触发了事件，实际上啥也不执行（除非自己自定义一个compiler.hooks.environment.tap('name',()=>{})）。再看另一个afterEnvironment，这个事件，...

回顾内容，我们之前讲完了了NodeEnvironmentPlugin。先回答一道题，你了解哪些webpack插件，他们是干什么的？我了解NodeEnvironmentPlugin这个插件它是webpack内置函数，而且是webpack第一个执行的插件，它的主要作用是用来操作webpack输入输出，以及给webpack提供日志，集成了inputFileSystem，infrastructureLogger它相较于fs or graceful-fs，它增加了缓存策略，多次调用文件，会把方法合并，只调用一个文件，500ms内，如果再次调用该文件，直接走缓存。监听watchFileSystem，加入了...

从上文开始，我们分析到了NodeEnvironmentPlugins，知道了webpack是怎么优化文件读取的。我们接着看剩下没看的代码 compiler.inputFileSystem = new CachedInputFileSystem(fs, 60000); const inputFileSystem = compiler.inputFileSystem; compiler.outputFileSystem = fs; compiler.intermediateFileSystem = fs; compiler.watchFileSystem = new NodeWatchFileSy...

接着上一节内容，我们分析到applyWebpackOptionsBaseDefaults，我们继续分析下一行代码。const compiler = new Compiler(options.context, options);我们先来想一下这两个参数，一个是context全局上下文参数，第二个是options，经过处理过的config参数先说一下Complier对应源码在哪里，对应lib/compiler.js文件webpack 源码中这个类有1100行代码，确实很多，我看着也烦的慌，但是我们慢慢来看因为我们这里没有调用compiler任何的方法，所以我们现在没必要看他上面的方法 class ...

在面试中，我们总会被问到webpack相关的问题，如webpack的loader,plugins是什么，有什么区别，又比如webpack的代码分割是怎么实现的，等一系列问题，很多人不能从底层彻底了解具体的实现，出于此目的，我想写一篇专栏，专门分析webpack源码的教程，其实已经有很多这种类型的文章了，但是我还想写一个专栏，我觉得市面上讲的还是有些粗糙，我要讲的更细更多一些。 废话不多说，接下来直接分析webpack源码。平常我们一般都会使用webpack-cli来调用webpack，但其实webpack-cli，底层帮助我们做的操作就是调用了webpack的函数webpack函数 有两个参数...

awk '{ l=length($0) f=l%3 for (i=1;i<=l;i++){ printf substr($0,i,1) if((i-f)%3==0 && i!=l) printf "," } print "" }' nowcoder.txt

package main import . "nc_tools" /* * type ListNode struct{ * Val int * Next *ListNode * } */ /** * * @param pHead ListNode类 * @return ListNode类 */ func ReverseList(pHead *ListNode) *ListNode { if pHead == nil || pHead.Next == nil { return pHead } var newHead *ListNode for pHead != nil { p...