... 上面这些问题可能我们在开发中已经知道如何解决，但是问题产生的原理，以及解决方案的原理可能会模糊不清。在解决这些问题的过程中，我们往往会遇到非常多的概念：像素、分辨率、PPI、DPI、DP、DIP、DPR、视口等等，你真的能分清这些概念的意义吗？ 本文将从移动端适配的基础…

让我们像 bahmutov/vue-calculator 应用一样，借助 Vue CLI 来搭建一个 Vue 应用脚手架。在本文中，我将展示如何检测应用的源代码以收集其代码覆盖率信息。其后我们将利用该代码覆盖率报告来引导端到端测试的编写。 示例应用可在 bahmutov/vue…

用 React 全家桶 + TS 写项目快一年了，大大小小的坑踩了很多，在此整理了在项目中遇到的疑惑和问题。 体会：不要畏惧 TS，别看 TS 官方文档内容很多，其实在项目中常用的都是比较基础的东西，像泛型运用、一些高级类型这种用的很少（封装库、工具函数、UI组件时用的比较多）…

在这里「增量」这个概念的对立面是「全量」。在 Linux 系统中当需要备份数据或者跨服务器同步文件时，会用到一个叫 rsync 的工具，它的速度会比 scp/cp 命令更快，因为它会先判断已经存在的数据和新数据的差异，只传输不同的部分，即「增量」同步。 在前端开发工程化领域，本…

1. 核心概念 entry：入口。webpack是基于模块的，使用webpack首先需要指定模块解析入口(entry)，webpack从入口开始根据模块间依赖关系递归解析和处理所有资源文件。 output：输出。源代码经过webpack处理之后的最终产物。 loader：模块转…

Webpack可以将其理解是一种基于事件流的编程范例，一个插件合集。 而将这些插件控制在webapck事件流上的运行的就是webpack自己写的基础类Tapable。 将plugin控制在webapack事件流上运行（如下图）。后面我们将看到核心的对象 Compiler、Com…

随着前端工程化的不断发展，构建工具也在不断完善。作为大前端时代的新宠，webpack渐渐成为新时代前端工程师不可或缺的构建工具，随着webpack4的不断迭代，我们享受着构建效率不断提升带来的快感，配置不断减少的舒适，也一直为重写的构建事件钩子机制煞费苦心，为插件各种不兼容心灰…

前言 本文代码浅显易懂，思想深入实用。此属于react进阶用法，如果你还不了解react，建议从文档开始看起。 我们都知道高阶函数是什么, 高阶组件其实是差不多的用法，只不过传入的参数变成了react组件，并返回一个新的组件. A higher-order component i…

中间件提供第三方插件的模式，自定义拦截 action -> reducer 的过程。变为 action -> middlewares -> reducer 。这种机制可以让我们改变数据流，实现如异步 action ，action 过滤，日志输出，异常报告等功能。 1.一个组件所…