OSSForks/react
1
0
Fork 0
mirror of https://github.com/zebrajr/react.git synced 2025-12-06 12:20:20 +01:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity
39c6545cef
react/compiler/packages/react-mcp-server
History
Henry Q. Dineen ed1351c4fb
[compiler] improve zod v3 backwards compat (#34877) 
## Summary

When upgrading to `babel-plugin-react-compiler@1.0.0` in a project that
uses `zod@3` we are running into TypeScript errors like:

```
node_modules/babel-plugin-react-compiler/dist/index.d.ts:435:10 - error TS2694: Namespace '"/REDACTED/node_modules/zod/v3/external"' has no exported member 'core'.

435     }, z.core.$strip>>>;
             ~~~~
```

This problem seems to be related to
d6eb735938, which introduced zod v3/v4
compatibility. Since `zod` is bundled into the compiler source this does
not cause runtime issues and only manifests as TypeScript errors. My
proposed solution is this PR is to use zod's [subpath versioning
strategy](https://zod.dev/v4/versioning?id=versioning-in-zod-4) which
allows you to support v3 and v4 APIs on both major versions.

Changes in this PR include:

- Updated `zod` import paths to `zod/v4`
- Bumped min `zod` version to `^3.25.0` for zod which guarantees the
`zod/v4` subpath is available.
- Updated `zod-validation-error` import paths to
`zod-validation-error/v4`
- Bumped min `zod-validation-error ` version to `^3.5.0` 
- Updated `externals` tsup configuration where appropriate. 

Once the compiler drops zod v3 support we could optionally remove the
`/v4` subpath from the imports.

## How did you test this change?

Not totally sure the best way to test. I ran `NODE_ENV=production yarn
workspace babel-plugin-react-compiler run build --dts` and diffed the
`dist/` folder between my change and `v1.0.0` and it looks correct. We
have a `patch-package` patch to workaround this for now and it works as
expected.

```diff
diff --git a/node_modules/babel-plugin-react-compiler/dist/index.d.ts b/node_modules/babel-plugin-react-compiler/dist/index.d.ts
index 81c3f3d..daafc2c 100644
--- a/node_modules/babel-plugin-react-compiler/dist/index.d.ts
+++ b/node_modules/babel-plugin-react-compiler/dist/index.d.ts
@@ -1,7 +1,7 @@
 import * as BabelCore from '@babel/core';
 import { NodePath as NodePath$1 } from '@babel/core';
 import * as t from '@babel/types';
-import { z } from 'zod';
+import { z } from 'zod/v4';
 import { NodePath, Scope } from '@babel/traverse';
 
 interface Result<T, E> {
```

Co-authored-by: Henry Q. Dineen <henryqdineen@gmail.com>
2025-10-16 09:46:55 -07:00
..
src [compiler] improve zod v3 backwards compat (#34877) 2025-10-16 09:46:55 -07:00
package.json [compiler] improve zod v3 backwards compat (#34877) 2025-10-16 09:46:55 -07:00
README.md [compiler] Init react-mcp-server (#32859) 2025-04-14 18:39:00 -04:00
todo.md [compiler] Init react-mcp-server (#32859) 2025-04-14 18:39:00 -04:00
tsconfig.json [compiler] Init react-mcp-server (#32859) 2025-04-14 18:39:00 -04:00
tsup.config.ts [compiler] Add missing copyrights (#33004) 2025-04-23 22:04:44 -04:00

README.md

React MCP Server (experimental)

An experimental MCP Server for React.

Development

First, add this file if you're using Claude Desktop: code ~/Library/Application\ Support/Claude/claude_desktop_config.json. Copy the absolute path from which node and from react/compiler/react-mcp-server/dist/index.js and paste, for example:

{
  "mcpServers": {
    "react": {
      "command": "/Users/<username>/.asdf/shims/node",
      "args": [
        "/Users/<username>/code/react/compiler/packages/react-mcp-server/dist/index.js"
      ]
    }
  }
}

Next, run yarn workspace react-mcp-server watch from the react/compiler directory and make changes as needed. You will need to restart Claude everytime you want to try your changes.