mirror of
https://github.com/facebook/react.git
synced 2026-02-27 03:07:57 +00:00
## Summary Part 1 of adding a "Config Override" panel to the React compiler playground. The panel is placed to the left of the current input section, and supports converting the comment pragmas in the input section to a JavaScript-based config. Backwards sync has not been implemented yet. NOTE: I have added support for a new `OVERRIDE` type pragma to add support for Map and Function types. (For now, the old pragma format is still intact) ## Testing Example of the config overrides synced to the source code: <img width="1542" height="527" alt="Screenshot 2025-08-28 at 3 38 13 PM" src="https://github.com/user-attachments/assets/d46e7660-61b9-4145-93b5-a4005d30064a" />
React Compiler Playground
An interactive playground to demonstrate, test, and have fun with React Compiler.
Setup
# Build React Compiler from source and install Playground dependencies.
$ yarn
# Or similarly
$ npm install
Development
# Start the local development server with
$ yarn dev
# Or
$ npm run dev
# Rerun the following (in a separate terminal window) when React Compiler
# is changed locally to keep Playground in sync.
$ yarn
Testing
# Install playwright browser binaries
$ npx playwright install --with-deps
# Run tests
$ yarn test
Deployment
This project has been deployed using Vercel. Vercel does the exact same thing as we would
locally, by running yarn at the install step in the Playground directory to build
React Compiler from source and symlink it as its dependency.
This means that Playground is automatically deployed on every push and pull requests will reflect
the behaviors of React Compiler of that commit.