栗子前端技术周刊第 103 期 - Vitest 4.0、Next.js 16、Vue Router 4.6...

🌰栗子前端技术周刊第 103 期 (2025.10.20 - 2025.10.26):浏览前端一周最新消息,学习国内外优秀文章视频,让我们保持对前端的好奇心。

📰 技术资讯

  1. Vitest 4.0:Vitest 4.0 版本发布,作为一款由 Vite 驱动、兼容 Jest 的测试框架,Vitest 此次更新内容包括:引入了视觉回归测试功能、将其"浏览器模式"(可直接在浏览器中运行测试)升级至稳定版、新增了对 Playwright Traces 的支持等等。还有一点,从 Angular 21 版本开始,Vitest 将成为 Angular 的默认测试框架,取代 Karma 和 Jasmine。

  2. Next.js 16:这款热门的 React 框架在此次更新中新增了显式缓存组件,引入了用于 AI 辅助调试的 MCP 服务器,同时 Turbopack 与 React Compiler 的支持均已升级至稳定版等。

  3. Vue Router 4.6:Vue Router 4.6 版本发布,新增一项实验性的"自定义解析器"(Custom resolvers)功能,这些解析器能实现更小的路由运行时体积、更快的路由匹配速度、自定义参数类型,以及基于查询参数的匹配功能。

  4. pnpm 10.19 :此次更新为两项设置新增了版本范围限定控制:onlyBuiltDependenciesminimumReleaseAgeExcludeonlyBuiltDependencies 用于指定哪些包可以运行 postinstall 等脚本;minimumReleaseAgeExclude 用于指定哪些包可以不受 minimumReleaseAge 限制,始终安装最新版本。

  1. Bun v1.3.1 :继重大更新的 Bun 1.3 版本之后,本次推出的是一个小版本更新,在各个方面均带来了一些幅度相对温和的改进,如更快的 bun buildbun test 现在会暴露 Vitest 的全局变量 vi 等等。

📒 技术文章

  1. Importing vs Fetching JSON :JSON 的导入(Import)与获取(Fetch)对比 - 你可能已经习惯用 import 语句加载代码,但如果要加载 JSON 文件该怎么做呢?目前已在主流浏览器中获得广泛支持的"导入属性"(Import attributes)让这一需求成为可能,但相比使用 fetch 方法,它是否有实际意义?作者对此展开了调研。

  2. 公司前端项目 ESLint 规则集统一化:针对各个前端项目 ESLint 规则不一致的情况,作者分别对 Vue 和 React 定制一套 ESLint 规则集,并发布到公司私有 npm 仓库,在各项目中统一安装和使用。

  3. Monorepo 工具大比拼:为什么我最终选择了 pnpm + Turborepo?:作者在文中介绍了主流 Monorepo 工具的对比分析、pnpm workspace 的核心优势、Turborepo 为什么这么快、如何根据项目规模选择合适的工具。

🔧 开发工具

  1. p-limit 7.2 :该工具可用于运行多个返回 Promise 的函数及异步函数,并能限制其并发执行数量。在当前版本中,.map() 方法现在不仅能接收数组,还可接收可迭代对象(iterable)。
  1. ESLint Markdown Language Plugin 7.5:该插件可对 Markdown 文档中的 JavaScript 和 TypeScript 代码块进行代码检查。
  1. Obra Icons:一套简洁统一的图标集,目前该图标库包含超过 1000 个图标,你可将其下载为 SVG 或 PNG 格式,也能直接复制代码用于 React 或 Svelte 项目。

🚀🚀🚀 以上资讯文章选自常见周刊,如 JavaScript Weekly 等,周刊内容也会不断优化改进,希望你们能够喜欢。

💖 欢迎关注微信公众号:栗子前端

相关推荐
Mintopia3 小时前
🚀 Next.js Edge Runtime 实践学习指南 —— 从零到边缘的奇幻旅行
前端·后端·全栈
GISer_Jing4 小时前
不定高虚拟列表性能优化全解析
前端·javascript·性能优化
Predestination王瀞潞4 小时前
WEB前端技术基础(第三章:css-网页美化的衣装-上)
前端·css
鹏多多4 小时前
深度解析React中useEffect钩子的使用
前端·javascript·react.js
超级大只老咪4 小时前
CSS基础语法
前端
冰暮流星4 小时前
css之box-sizing属性
前端·javascript·css
倚肆4 小时前
CSS ::before 和 ::after 伪元素详解
前端·css
彭同学她同桌4 小时前
Mac-终端
开发语言·javascript·macos
华洛4 小时前
聊一下如何稳定的控制大模型的输出格式
前端·产品经理·ai编程