给 Joe 主题添加代码行号 因为已习惯用 Markdown 写文章，最近我将博客从 Wordpress 转到了Typecho。转换过程还是比较顺利的。我选的是 Joe 主题，最新版本 7.3.7。Joe 内置了代码高亮，无需借助任何插件。实际上是借助 Prism 来实现的，支持200种语言，但就是没有我要的显示代码行号功能。

测试二次封装的 UI 组件 有了 Testing Library 这个神器之后。编写单元测试变得容易多了。当然，对于基于原生 UI 组件测试来说，这并不是问题。然而在实际开发中，我们会用到第三方的 UI 组件库。比如在国内，开发 Vue 应用一般会选用 Element UI 作为组件库，开发 React 应用一般会选用 antd。这些第三方的 UI 组件库组件很多具有复杂的交互功能，基于它们进行二次封装 UI 组件就比较难测试。原因有如下几个方面。

React CRUD 项目 本项目使用 React + TypeScript + antd + axios + JSON Server 开发的简单 CRUD Web 应用。麻雀虽小，五脏俱全。感兴趣的话，可以访问该项目的 Github查看。

Vue CRUD 项目 本项目使用 Vue + element-ui + axios + testing library + JSON Server 开发的简单 CRUD Web 应用。麻雀虽小，五脏俱全。感兴趣的话，可以访问该项目的 GitHub 查看。

使用 Vitest 模拟 Vue Router Vue Router 4 是 Vue 3 的官方路由库。自从引入了组合式 API，我们可以在新版的 Vue Router 中使用新的组合式函数。那么我们该如何来模拟这些函数呢？目前 Vue Test Utils 官网文档并没有这方面的介绍。因此，本教程将讲解如何使用 Vitest 模拟 Vue Router，以便测试依赖于应用程序导航的业务逻辑。