Biome.js 中 useArrowFunction 规则与 "use server" 指令的兼容性问题分析

在 React Server Components 和 Next.js 应用开发中，"use server" 指令是一个关键特性，它用于标记服务器端执行的函数。然而，在使用 Biome.js 的代码格式化工具时，开发者可能会遇到一个特殊问题：当启用 useArrowFunction 规则时，该工具会意外移除函数声明前的 "use server" 指令。

问题现象

当开发者在代码中这样声明一个服务器函数时：

const serverFunction: ServerFunctionClient = async function (args) {
  "use server";
  return handleServerFunctions({
    ...args,
    config,
    importMap,
  });
};

运行 Biome.js 的 lint:fix 命令后，代码会被转换为箭头函数形式，但同时会丢失关键的 "use server" 指令：

const serverFunction: ServerFunctionClient = async (args) => {
  return handleServerFunctions({
    ...args,
    config,
    importMap,
  });
};

技术背景

"use server" 是 React 和 Next.js 生态中的重要指令，它有两个主要作用：

1. 明确标识该函数将在服务器端执行
2. 为 RSC (React Server Components) 提供必要的元数据

Biome.js 的 useArrowFunction 规则旨在将传统的函数表达式转换为更简洁的箭头函数形式。然而，在处理包含特殊指令的函数时，该规则未能保留这些关键元信息。

解决方案

Biome.js 团队已经在主分支中修复了这个问题。新版本会正确处理以下情况：

1. 保留函数转换前的所有指令和注释
2. 确保 "use server" 等特殊指令在转换后仍然存在
3. 正确处理函数类型注解和返回类型

开发者可以通过以下方式解决此问题：

• 升级到包含修复的最新版本
• 在配置中临时禁用 useArrowFunction 规则
• 使用夜间构建版本（如 1.9.5-nightly）获取最新修复

最佳实践建议

1. 在涉及 RSC 的项目中，建议在升级 Biome.js 前检查变更日志
2. 对于关键服务器函数，考虑添加测试验证指令是否保留
3. 在团队协作项目中，统一 Biome.js 版本以避免不一致的格式化结果

这个问题展示了现代 JavaScript 工具链在处理新兴语法和框架特性时面临的挑战，也提醒我们在自动化代码转换时需要特别注意保留语义重要的元信息。