在实际业务开发中，有可能遇到这样一种问题，因平台打包或者差异性等原因，提交给测试的包，我们需要确定是否为某一版本，这就要求我们的生成包中需要有一版本标记，并且这个版本标记在运行时是固定不变但在下次编译时是可变的，而且在打包编译生成时写入。 前端工程化，目前使用较多的为Webpa…

webpack作为前端最热门的打包工具，除了有丰富灵活的配置，还有强大的可扩展性（loader和plugin机制）。现在，我主要介绍下plugin的开发方式。 webpack配置维护了一个插件列表（plugins）,webpack打包时会实例化插件，并传入参数来改变插件的行为。…

Webpack通过Loader完成模块的转换工作，让“一切皆模块”成为可能。Plugin机制则让其更加灵活，可以在Webpack生命周期中调用钩子完成各种任务，包括修改输出资源、输出目录等等。 今天我们一起来学习如何编写Webpack插件[1]。 在编写插件之前，还需要了解一下…

plugin的作用是解决功能定制的问题。complier可以看出是webpack实例化对象，compilation是其中一个重要过程，在这个阶段中提供了很多钩子函数对chunks进行定制。

webpack运行图内置钩子对象钩子Compilerrun,compile,compilation,make,emit,doneCompilationbuildModule,normalModuleL

3. HappyPack HappyPack就能让Webpack把任务分解给多个子进程去并发的执行，子进程处理完后再把结果发送给主进程。 happypack 4. ParallelUglifyPlugin 5. 服务器自动刷新 6. 区分环境 在开发过程中方便开发调试的环境。 …

在上一篇文章Webpack配置全解析介绍了Webpack中loader和plugins的一些基本用法，当loader和plugins使用较多后项目也会越来越耗时，因此这次我们继续学习如何优化webpack的配置来让我们的项目运行的更快耗时更短。 本文将从缩小文件搜索范围、减少打…

webpack在前端化过程中十分重要，所以花了一段时间学习webpack，以及webpack4新特性，本文是按照从易到难的过程，梳理部分webpack概念，常见的loader，plugins，webpack4新特新，还有部分高级概念。 Output: 如何命名输出文件，以及输出…

在研究 HMR 的过程中，通过 Chrome 的开发者工具，我知道浏览器是通过 websocket 和 webpack-dev-server 进行通信的，但是我在 websocket 中并没有发现任何代码块。那么新的代码块是怎么跑到浏览器的呢？这个 websocket 又有什么…