前言 Module，作为webpack中的基本模块单元，继承于DependenciesBlock，使其具备缓存其他模块而形成的依赖关系，也就是说，webpack中的关于模块的定义声明皆来自于此！我们所定义的一个个文档都是一个个的模块，模块之间允许互相依赖，而依赖在程序中的表现形式，则是以DependenciesBlock中的Dependency[]数组来存储的 Depe...

前言 作为实际开始编译的入口，该插件由webpack的核心默认插件自动加载，无需额外通过配置文件引入！ 入口的开始 通过对该插件的代码阅读后发现，该插件主要针对两个钩子容器函数设置监听动作 compiler.hooks.compilation compiler.hooks.make 🌠 下面我们关键分析一下这个compiler.hooks.make触发时，做了...

前言 在阅读到Compilation的代码执行过程时，发现有一个隐藏的异步队列执行者，😕 这里为啥要单独整一篇文章来阐述这个异步队列执行者呢？我觉得应该是在于它的一个比较独特的设计理念打动了我，下面就来具体分析一下并尝试来使用这个异步队列的执行者！添加完成一个元素后，自动执行一个对应的回调动作，并能够实现与父AsyncQueue对象共享的“线程队列”资源 如何使用？1...

前言 官方链接 DllPlugin一般与DllReferencePlugin配套使用， 😕 为什么这么说呢？ DllPlugin一般用来在webpack中创建一个单独的dll-only-bundles，同时生成一个名为manifest.json文件； DllReferencePlugin则是会通过引用上述第一步所创建出来的manifest.json文件，来告知如何加载...

前言官方链接 webpack中真正的”编译器执行者”，Compilation实例能够访问所有的模块和它们的依赖（大部分是循环依赖）。 它会对应用程序的依赖图中所有模块， 进行字面上的编译(literal compilation)。 在编译阶段，模块会被加载(load)、封存(seal)、优化(optimize)、 分块(chunk)、哈希(hash)和重新创建(rest...

前言官方链接 NormalModuleReplacementPlugin 允许我们将与 resourceRegExp 匹配的资源替换为 newResource。如果 newResource 是相对的，则它是相对于先前资源解析的。如果 newResource 是一个函数，它应该覆盖所提供资源的请求属性。☝ 官方的描述有点绕，简而言之，就是模块的在加载之前进行一个替换，这个...

前言 官方链接单从其名字上来看，可以简单理解为创建module的工厂！ 而实际在阅读完它的源码的时候发现，其实它就真的是用来创建module的工厂！Compiler使用NormalModuleFactory模块生成各类模块，从entry入口开始，此模块回分解每个请求，解析配置文件webpack.config.js内容来查找进一步的请求，然后通过分解所有的请求以及解析新的文...

前言 维护着一个data属性，主要负责记录与读取之前的构建记录，关于这个构建记录，官方的描述是：webpack 的 “records” 记录 - 即「用于存储跨多次构建(across multiple builds)的模块标识符」的数据片段，一般可以通过与webpack.config.js配合配置，直接讲对应的文件给输出出来，可以使用此文件来跟踪在每次构建之间的模块变化。...

前言 webpack内部的自执行的插件，主要负责提供infrastructureLogger属性到compiler对象上，并创建对应的文件属性到compiler对象上，然后监听到compiler.hooks.beforeRun钩子容器中，将过程日志怼到标准输入中！用于基础设施水平的日志选项

前言 ProgressPlugin提供了一种自定义编译过程中进度报告方式的方法！ 官方链接 使用方式 一般地，我们可以通过创建一个ProgressPlugin对象并传递允许的可选参数，来实现自定义输出的目的！ 123456789// webpack.config.jsconst {ProgressPlugin} = require("webpack");module....

前言 上文中我们所提及到的webpack创建了一个Compiler对象，由它来进行相关的打包任务动作的启动等，而且作为所有的插件所共同访问的到的一个编译器对象，😕 那么，这个Compiler是什么呢？？它做了哪些事情呢？ Compiler的组成 Compiler是什么?执行过程是怎样的？ Compiler 模块是 webpack 的主要引擎，它通过 CLI 或者 No...

前言 现在基本上每一个前端童鞋都与webpack在工作学习上都有所依赖，不管是以前还是未来，webpack都将占据非常重要的地位，而且都会与每一位前端童鞋息息相关，那么我是否可以像之前阅读其他的源码一样，来通过阅读webpack的源码，一步一步跟着代码来读懂这个webpack呢？起初我也是这么做的，然后我放弃了，其中的代码量之多，而且又超级复杂，错综复杂我觉得已经不能够用...

前言 在刚接触webpack的时候，仅仅只是懂得了关于如何通过简单的配置，来告知webpack如何进行一个打包工作，但是，对于webpack中具体是如何工作的，却全然不晓得，因此，觉得很有必要来对其中的执行过程进行一个深入的学习，在学习的过程中，又遇到了一个看着一头雾水的代码this.hooks.compiler.XXX系列方法，通过相关的资料查阅才知道，原来webpac...

前言 基于less的基础上进行的二次改造，项目主要是基于grunt + assemble + handlebars来进行搭建的，借助于handlebars-help所提供的便捷helpers工具类，来快速的对页面进行输出，并通过自定义的相关额外的helpers工具类，来实现文档的自动关联、自动锚点、自动配置的数据、按照既定的模版规范来输出对应的html页面内容 如何搭建...

前言 在第一次接触Assemble的时候，觉得自己以前好像不是这么走过来的，自己以前是直接上jquery，或者原生的编码，对于项目的打包也是采用的最原始的方式来打包，没有去借助于一些便捷的打包工具，比如gulp、grunt等，等到后续慢慢接触久了，才有了这个想要“偷懒”的想法，在之前的关于grunt的学习中也了解到，grunt就是将一些经常做的事情，交由grunt框架来做...

前言 从express的脚手架中默认初始化的是handlebars模版引擎，那么它是怎样的一个引擎呢？平时在项目过程中是否有使用到它的一个场景呢？👉 我打算搭建多另外一个站点，模仿less的关于文档的快捷在线浏览中文站点，不想仅仅单纯通过翻译别人的网站，而自己根本不清楚其中的一个使用相关原理，因此，我开始这个自建CMS站点之路，而且从国内目前的前端来看，以前的前端一来就...

前言 在完成一两天的通读grunt在线文档之后，原来grunt也并没有那么地复杂，首先他是一个nodejs程序，无非就是将反复重复的工作(比如有压缩、编译、单元测试、linting等操作)通过脚本来自动化，只需要进行一个命令的执行，即可完成一系列既定执行顺序的操作，可以理解为一系列固定流程的脚本集合，他的庞大主要在于他所提供的插件，在运行grunt的过程中，可以通过对插件...

前言 终于轮到关于mongodb的学习了，作为 1⃣ 前端开发佬，想要进入全栈开发的领域，必不可少要涉及到数据库方面的编程技能。关于数据库的一个个人见解就是：它是一种特殊的文件格式，隐藏了对内容的直接访问，提供相关便捷的方法来操作文件内容，提供增删查改逻辑操作，满足业务需求！而本文要学习的这个mongodb是属于NoSQL(Not only SQL，不仅仅是SQL)的一种...

小技能 在习惯了webstorm这ide之后，转战vscode的时候，🈶 着诸多使用上的不习惯，特别是关于这个编码提示，个人已经习惯了webstorm自带的代码提示功能，在上手vscode的时候，发现这个也需要自己来整🌠 可以使用@type来进行日常coding的提示，仅仅需要在项目目录中运行以下脚本： 1npm install --save-dev @types/...