摘要：
在日常的前端开发工作中，我们经常依赖各种命令行工具来提高效率和代码质量。例如，create-react-app 和 eslint 等工具不仅简化了项目的初始化过程，还能自动执行代码检查和格式化任务。当我们使用这些工具时，它们通常会通过一系列互动式的问答来收集必要的信息，从而根据我们的选择进行相应的配 阅读全文
摘要：
在日常的前端开发中，我们常常借助各种基于 Node.js 的脚手架工具来加速项目搭建和维护，比如 create-react-app 可以一键初始化一个 React 项目，eslint 则帮助我们保持代码的整洁和一致。而在公司内部，为了更好地满足特定业务的需求，我们往往会构建自己的脚手架工具，如自定义 阅读全文
摘要：
我们已经了解了许多关于 Webpack 的知识，但要完全熟练掌握它并非易事。一个很好的学习方法是通过实际项目练习。当我们对 Webpack 的配置有了足够的理解后，就可以尝试重构一些项目。本次我选择了一个纯HTML/JS的PC项目进行重构，项目位于 GitHub 上，非常感谢该项目的贡献者。 重构案 阅读全文
摘要：
目前，前端开发已经离不开由 CommonJS、ES Modules 和 Webpack 构建的模块化开发环境。无论是 JavaScript、CSS、图片还是其他资源，都可以作为一个模块来处理。那么，模块化究竟是如何发展到今天的呢？ 全局函数模式 最初的前端模块化尝试是通过 全局函数来实现的。例如，在 阅读全文
摘要：
在上一篇测试指南中，我们介绍了Jest 的背景、如何初始化项目、常用的匹配器语法以及钩子函数的使用。这一篇篇将继续深入探讨 Jest 的高级特性，包括 Mock 函数、异步请求的处理、Mock 请求的模拟、类的模拟以及定时器的模拟、snapshot 的使用。通过这些技术，我们将能够更高效地编写和维护 阅读全文
摘要：
随着JavaScript在前后端开发中的广泛应用，测试已成为保证代码质量的关键环节。 为什么需要单元测试 在我们的开发过程中，经常需要定义一些算法函数，例如将接口返回的数据转换成UI组件所需的格式。为了校验这些算法函数的健壮性，部分开发同学可能会手动定义几个输入样本进行初步校验，一旦校验通过便不再深 阅读全文
摘要：
公司项目一般都是使用集团封装好的脚手架，脚手架内部实现咱看不到也摸不着，好不容易组内推行新的UI框架，需要自行定义 webpack 配置，这可是个绝佳的好机会，我对配置过程进行了梳理，把商业项目的成熟配置小跑着送上。 初始化 首先新建一个空文件夹，执行 npm init 初始化生成 package. 阅读全文
摘要：
平时我除了业务需求，偶尔会投入到UI组件的开发中，大多数时候只会负责自己业务场景相关或者一小部分公共组件，极少有从创建项目、集成可视化、测试到发布的整个过程的操作，这篇文章就是记录组件开发全流程，UI组件在此仅作为调试用，重点在于集成项目环境。 组件 我们使用 React + TypeScript 阅读全文
摘要：
前段时间在做小程序到H5的迁移，其中小程序中下拉刷新的功能引起了产品的注意。他说到，哎，我们迁移后的H5页面怎么没有下拉刷新，于是乎，我就急忙将这部分的内容给填上。 本来是计划使用成熟的组件库来实现，尝试之后发现这些组件和我们H5页面的其他逻辑有冲突（H5还有吸顶、锚点、滑动高亮、横向滚动），小小H 阅读全文
摘要：
事情的起因是这样的，在一个已上线的项目中，其中一个包含登录和获取菜单的接口因响应时间较长，后端让我尝试未经服务转发的另一域名下的新接口，旧接口允许跨域请求，但新接口不允许本地访问（只允许发布测试/生产的域名访问）。 问题 那么问题来了，本地环境该如何成功访问到新的接口并验证业务功能是否生效呢？ 尝试 阅读全文