466 - 《Waku Server Action》

看完 465 - 《TanStack Start》 的 Server Function，看到 译：Waku：Server actions 来了，接着翻一下实现。

Waku 之前在 276 - 《手撕源码 30：wakuwork 和 RSC 原理》 时就看过一次源码。他的作者是 Zustand 和 Jotai 的维护者，一开始只是一个探索 RSC 的理论研究项目，后面不断添加新功能，三月他们推出了基于文件的新路由 API，现在他们已经完全支持 Server Actions 。

从 PR 看，主要是两部分功能。

1、use server action from client modules。

先看 case。

// server action file
// func.ts
export const count = () => {
  let num = fs.readFileSync('count.txt');
  fs.writeFileSync('count.txt', num + 1);
}

// client module file
// Foo.tsx
import { count } from 'func';
export function Foo() {
  useEffect(() => { count() });
}

要实现这个，需要在打包 client 产物时，对 use server 的文件做 transform，把 export 的内容转成 reference，通过 callServerRSC 的方式从服务端获取。

其中 transformClient 主要实现在 https://github.com/dai-shi/waku/pull/714/files#diff-9f11c045328cf38282ceee67d00a518faf8c5fd3c27073bc01ee64f77245e401R9 。用 swc 解析代码（感觉可以先用字符串做个 includes 判断，可以减少大量的 swc 解析耗时），然后…

比如，

'use server';
export const foo = 1;

会被转换为。

import { createServerReference } from 'react-server-dom-webpack/client';
import { callServerRSC } from 'waku/client';
export const foo = createServerReference('server——id#name', callSer