Repository: TanStack/router
Pull request #3414 (2025-02-12 23:43:40)

fix: file-wide `use server` now handles export const var

nx-cloud[bot]: 
View your [CI Pipeline Execution ↗](https://cloud.nx.app/cipes/67ad324450d6165ebf38fde5?utm_source=pull-request&utm_medium=comment) for commit dcb86ae806b9cc3694d57730f0b644335fbab5ac.

---

☁️ [Nx Cloud](https://cloud.nx.app?utm_source=pull-request&utm_medium=comment) last updated this comment at `2025-02-12 23:44:05` UTC

<!-- NX_CLOUD_APP_COMMENT_END -->
pkg-pr-new[bot]: 
[Open in Stackblitz](https://pkg.pr.new/template/75d46caf-925a-4879-a3c4-a91d11eec593)
<details><summary><b>More templates</b></summary><p>

- [tanstack-router-react-example-authenticated-routes](https://pkg.pr.new/template/f8df0f49-44de-4081-b15e-5fb5eef9a1bb)
- [tanstack-router-react-example-basic](https://pkg.pr.new/template/6338bdeb-0272-406e-9c73-bccf6c9801d2)
- [tanstack-router-react-example-basic-file-based](https://pkg.pr.new/template/fd53e7b6-ab0d-4530-925a-0a0ff77b1674)
- [tanstack-router-react-example-basic-file-based-codesplitting](https://pkg.pr.new/template/8d364ebd-4a66-40bb-ac40-f661bc0f606e)
- [tanstack-router-react-example-basic-default-search-params](https://pkg.pr.new/template/b3681c23-d9bb-45e8-a2e2-79900c865d72)
- [tanstack-router-react-example-react-query](https://pkg.pr.new/template/3bd7983a-a125-4bf9-83eb-2c8b80362a1e)
- [tanstack-router-react-example-basic-react-query-file-based](https://pkg.pr.new/template/cee887fe-b11d-4bae-b215-ececf139eab4)
- [tanstack-router-react-example-basic-ssr-file-based](https://pkg.pr.new/template/232fb9ce-fcef-47e0-945f-b4fd8ec10e89)
- [tanstack-router-react-example-basic-ssr-streaming-file-based](https://pkg.pr.new/template/465b2628-b2d4-46fa-a975-07002f6e33fb)
- [tanstack-router-react-example-basic-virtual-file-based](https://pkg.pr.new/template/10c2e084-9e31-4807-b1ab-65ac747ee06e)
- [tanstack-router-react-example-basic-virtual-inside-file-based](https://pkg.pr.new/template/a4f0cf1d-a707-4f01-9076-fb56471d4e69)
- [tanstack-router-react-example-deferred-data](https://pkg.pr.new/template/de3f4bb1-9ba3-4d87-b21b-273ca0b019fe)
- [tanstack-router-react-example-kitchen-sink-file-based](https://pkg.pr.new/template/34ff35fa-9aaf-40c8-8036-7a449f49ff0d)
- [tanstack-router-react-example-kitchen-sink](https://pkg.pr.new/template/4d04f086-86c0-4fa0-8fbf-6584acddbf6d)
- [tanstack-router-react-example-kitchen-sink-react-query](https://pkg.pr.new/template/bb8a6808-194b-47db-82eb-8e40f94812e0)
- [tanstack-router-react-example-kitchen-sink-react-query-file-based](https://pkg.pr.new/template/98ef24fa-0c1b-4a3b-a9bc-53e2204220e3)
- [tanstack-router-react-example-large-file-based](https://pkg.pr.new/template/50f31fcf-4914-4e25-afa0-93197fe9a133)
- [tanstack-router-react-example-navigation-blocking](https://pkg.pr.new/template/9955e578-a488-4c55-a693-14e4b1f61cdc)
- [tanstack-router-react-example-quickstart](https://pkg.pr.new/template/a997133b-7351-4b85-b6b0-2f723a94c882)
- [tanstack-router-react-example-location-masking](https://pkg.pr.new/template/c42ab8c6-5407-4684-b6ec-c75d64748bec)
- [tanstack-router-react-example-quickstart-esbuild-file-based](https://pkg.pr.new/template/339ce686-55da-43c3-9b7c-b871d8e1f26b)
- [tanstack-router-react-example-quickstart-file-based](https://pkg.pr.new/template/fca0dbd3-9fb2-4065-9823-e6ae390b99bb)
- [tanstack-router-react-example-quickstart-rspack-file-based](https://pkg.pr.new/template/fd62e842-92cd-4d33-802d-80393d3263cd)
- [router-monorepo-react-query](https://pkg.pr.new/template/2ed23cc3-b429-4f98-8b40-a0518023897d)
- [tanstack-router-react-example-quickstart-webpack-file-based](https://pkg.pr.new/template/1d10ff38-b924-4680-8c39-eb421a741934)
- [router-mono-simple](https://pkg.pr.new/template/9d9f4659-66b1-49f0-9d20-1c1b5a6428f7)
- [router-mono-simple-lazy](https://pkg.pr.new/template/9fe6ffee-9d5e-41a1-88a5-b48c5eae0db7)
- [tanstack-router-react-example-scroll-restoration](https://pkg.pr.new/template/8f67c3ec-ed1d-428c-96c6-9c1171379cde)
- [tanstack-search-validator-adapters](https://pkg.pr.new/template/b878f3a3-a5f7-4f10-878d-6ca7204d6c6c)
- [tanstack-start-example-basic](https://pkg.pr.new/template/74623765-e6fc-445d-8b32-f3e8ba7e7c84)
- [tanstack-start-example-basic-auth](https://pkg.pr.new/template/c34ba9b0-0706-42c5-83e7-ee97b54be2e9)
- [tanstack-start-example-basic-react-query](https://pkg.pr.new/template/4a284934-9b91-460f-9ba9-2390da9dad46)
- [tanstack-start-example-basic-rsc](https://pkg.pr.new/template/6b1d2c7e-a43a-4b95-b3f7-b836af35aac5)
- [tanstack-start-example-basic-static](https://pkg.pr.new/template/ee121303-a325-42f3-804c-f1ceb18fd0b3)
- [tanstack-start-example-counter](https://pkg.pr.new/template/3e912d22-c4fc-46d1-b951-c6cf879489d7)
- [tanstack-start-example-clerk-basic](https://pkg.pr.new/template/e718e507-603a-49f2-b023-643503e16e8c)
- [tanstack-start-example-convex-trellaux](https://pkg.pr.new/template/d196ce9f-6dc7-4897-8392-397585f95c28)
- [tanstack-start-example-large](https://pkg.pr.new/template/4bf48918-4345-4171-8385-358ec52feadc)
- [tanstack-start-example-supabase-basic](https://pkg.pr.new/template/b270b385-bf78-484e-955b-393d09fe536a)
- [tanstack-start-example-trellaux](https://pkg.pr.new/template/bae0c8bd-3224-46f5-b59e-4de806361447)
- [tanstack-router-react-example-with-framer-motion](https://pkg.pr.new/template/cee75777-6f1a-49ef-a8f8-069c9d7ae401)
- [tanstack-router-react-example-with-trpc-react-query](https://pkg.pr.new/template/1d6ba87a-352e-4858-8581-94460e692532)
- [tanstack-router-react-example-with-trpc](https://pkg.pr.new/template/660b64b7-30f0-4ebf-8227-c8215672a6e0)

</p></details>
      
    


<details><summary><b>@tanstack/arktype-adapter</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/arktype-adapter@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/create-router</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/create-router@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/create-start</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/create-start@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/directive-functions-plugin</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/directive-functions-plugin@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/eslint-plugin-router</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/eslint-plugin-router@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/history</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/history@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/react-cross-context</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/react-cross-context@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/react-router-with-query</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/react-router-with-query@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/react-router</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/react-router@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-cli</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-cli@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-core</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-core@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-devtools</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-devtools@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-generator</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-generator@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-plugin</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-plugin@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-utils</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-utils@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/router-vite-plugin</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/router-vite-plugin@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/server-functions-plugin</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/server-functions-plugin@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-api-routes</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-api-routes@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-client</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-client@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-config</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-config@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-plugin</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-plugin@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-router-manifest</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-router-manifest@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server-functions-client</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server-functions-client@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server-functions-fetcher</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server-functions-fetcher@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server-functions-server</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server-functions-server@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server-functions-handler</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server-functions-handler@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/start-server-functions-ssr</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/start-server-functions-ssr@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/valibot-adapter</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/valibot-adapter@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/virtual-file-routes</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/virtual-file-routes@3414
```

</p></details>
      
    

<details><summary><b>@tanstack/zod-adapter</b></summary><p>

```
npm i https://pkg.pr.new/@tanstack/zod-adapter@3414
```

</p></details>
      
    

_commit: <a href="https://github.com/TanStack/router/runs/37131559584"><code>dcb86ae</code></a>_


Patch:
diff --git a/packages/directive-functions-plugin/src/compilers.ts b/packages/directive-functions-plugin/src/compilers.ts
index b359616a7..7be7d71e7 100644
--- a/packages/directive-functions-plugin/src/compilers.ts
+++ b/packages/directive-functions-plugin/src/compilers.ts
@@ -260,6 +260,24 @@ export function findDirectives(
           compileDirective(path.get('declaration') as SupportedFunctionPath)
         }
       },
+      ExportDeclaration(path) {
+        if (
+          babel.types.isExportNamedDeclaration(path.node) &&
+          babel.types.isVariableDeclaration(path.node.declaration) &&
+          (babel.types.isFunctionExpression(
+            path.node.declaration.declarations[0]?.init,
+          ) ||
+            babel.types.isArrowFunctionExpression(
+              path.node.declaration.declarations[0]?.init,
+            ))
+        ) {
+          compileDirective(
+            path.get(
+              'declaration.declarations.0.init',
+            ) as SupportedFunctionPath,
+          )
+        }
+      },
     })
   } else {
     // Find all directives


Test patch:
diff --git a/packages/directive-functions-plugin/tests/compiler.test.ts b/packages/directive-functions-plugin/tests/compiler.test.ts
index 28f5bc657..6aca7f1df 100644
--- a/packages/directive-functions-plugin/tests/compiler.test.ts
+++ b/packages/directive-functions-plugin/tests/compiler.test.ts
@@ -648,4 +648,66 @@ describe('server function compilation', () => {
       export { bytesSignupServerFn_1 };"
     `)
   })
+
+  test('file-wide use server directive', () => {
+    const code = `
+      'use server'
+
+      import { imported } from 'imported'
+
+      export const serverFnConstWithImport = async () => {
+        return imported
+      }
+
+      export function serverFnNamedWithImport () {
+        return imported
+      }
+    `
+
+    const client = compileDirectives({ ...clientConfig, code })
+    const ssr = compileDirectives({ ...ssrConfig, code })
+    const server = compileDirectives({
+      ...serverConfig,
+      code,
+      filename:
+        ssr.directiveFnsById[Object.keys(ssr.directiveFnsById)[0]!]!
+          .extractedFilename,
+    })
+
+    console.log(ssr.directiveFnsById)
+
+    expect(client.compiledResult.code).toMatchInlineSnapshot(`
+      "'use server';
+
+      import { createClientRpc } from "my-rpc-lib-client";
+      const serverFnConstWithImport_1 = createClientRpc("test_ts--serverFnConstWithImport_1");
+      export const serverFnConstWithImport = serverFnConstWithImport_1;
+      const serverFnNamedWithImport_1 = createClientRpc("test_ts--serverFnNamedWithImport_1");
+      export const serverFnNamedWithImport = serverFnNamedWithImport_1;"
+    `)
+
+    expect(ssr.compiledResult.code).toMatchInlineSnapshot(`
+      "'use server';
+
+      import { createSsrRpc } from "my-rpc-lib-server";
+      const serverFnConstWithImport_1 = createSsrRpc("test_ts--serverFnConstWithImport_1");
+      export const serverFnConstWithImport = serverFnConstWithImport_1;
+      const serverFnNamedWithImport_1 = createSsrRpc("test_ts--serverFnNamedWithImport_1");
+      export const serverFnNamedWithImport = serverFnNamedWithImport_1;"
+    `)
+
+    expect(server.compiledResult.code).toMatchInlineSnapshot(`
+      "'use server';
+
+      import { createServerRpc } from "my-rpc-lib-server";
+      import { imported } from 'imported';
+      const serverFnConstWithImport_1 = createServerRpc("test_ts--serverFnConstWithImport_1", async () => {
+        return imported;
+      });
+      const serverFnNamedWithImport_1 = createServerRpc("test_ts--serverFnNamedWithImport_1", function serverFnNamedWithImport() {
+        return imported;
+      });
+      export { serverFnConstWithImport_1, serverFnNamedWithImport_1 };"
+    `)
+  })
 })