杜杜杜大侠

前端在大多数人眼中的理解就是html+css+js,前端框架层出不穷，前端业务也越来越复杂。用健壮的代码来满足复杂的需求变得尤为重要。健壮的代码于我而言，就是变化的好扩展，不变的很稳定。这让我想到了设计模式的SO原则。 工厂模式就是将创建对象的过程封装起来。 通俗的说，就好比你…

我们之前编写的JavaScript都是在浏览器中运行的，所以我们可以直接在浏览器里面写代码，直接运行。那么问题来了，除了浏览器，我们编写的JavaScript代码还能在什么环境下运行呢？ 我们编写的JavaScript代码可以在node环境下运行。也就是说，我们的JavaScr…

首先，我们来看一张图。（很形象，借用别处） 如图所示，我们的js文件就相当于这棵树，tree-shaking就相当对摇动这个操作，目的是让枯黄的叶子和坏掉的苹果掉下来。说到这里，tree-shaking的原理就是，通过摇动我们的js文件，剔除掉DCE（Dead Code Eli…

保留在完全重新加载页面期间丢失的应用程序状态。 只更新变更内容。 在源代码中对css/js进行更改，会立刻在浏览器中同步更新。相当于在浏览器的devtools直接更改样式。 现在修改index.js文件，以便在print.js发生变更的时候，告诉webpack接收updated…

当webpack打包源码的时候，由于代码经过了压缩，很难定位到错误在原始代码中的位置。source map可以将编译后的代码映射回原始代码。source map有很多 可用选项,可以根据不同的场景配置。 在每次编译代码的时候，手动运行npm run build会很麻烦。 现在保…

webpack是JavaScript应用程序的静态模块打包工具。当webpack处理应用程序时，会在内部生成一副依赖图，依赖图会映射项目所需的每个模块，并生成一个或多个bundle。 以上主要是配置了打包的入口和出口，用到的node的path包，对路径的转化做处理。 webpa…