next.js 16 "use cache" functions must be async functions?

[fairjm]

Summary

I saw in the documentation that use cache can be used for non-async methods, but when I added it, it gave an error immediately. So, in reality, can use cache only be used with async functions?

doc: https://nextjs.org/docs/app/api-reference/directives/use-cache

const TestPage = () => {
  "use cache";
  return <div>TestPage</div>;
};

export default TestPage;

will result

./src/app/test/page.tsx:1:7
Ecmascript file had an error
> 1 | const TestPage = () => {
    |       ^^^^^^^^
  2 |   "use cache";
  3 |   return <div>TestPage</div>;
  4 | };

"use cache" functions must be async functions.

Additional information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:33:46 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T8112
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 22.20.0
  npm: 10.9.3
  Yarn: N/A
  pnpm: 10.18.3
Relevant Packages:
  next: 16.0.0 // Latest available version is detected (16.0.0).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.8.2
Next.js Config:
  output: standalone

Example

No response

[icyJoseph]

Yes they have to async functions. Fixing that entry right now.