mirror of
https://github.com/withastro/astro.git
synced 2024-12-23 21:53:55 -05:00
bd18e14a2c
* feat: add support for `jsxImportSource`, new JSX transform * Renderer: add Solid renderer (#667) * feat: add support for `jsxImportSource`, new JSX transform * WIP: solid renderer * [Renderer] Solid (#656) * feat: add support for `jsxImportSource`, new JSX transform * WIP: solid renderer * Solid renderer: fix SSR of children, hydration (top level) Caveat: cannot hydrate children/descendants of hydrated parents * Fix hydration of fragments * fix: SyntaxError in React/Preact renderers * fix: errors in React/Preact renderers * feat: update react external * chore: update examples * chore: delete old changelog * chore: update astro config Co-authored-by: Nate Moore <nate@skypack.dev> * Changing the preact to Solid (#669) * chore: use new client:visible syntax * fix: dev script issue * chore: cleanup SolidJS example * docs: update framework example docs * chore: cleanup framework-multiple example * fix: remove SolidJS false-positives from Preact renderer * chore: add changeset Co-authored-by: eyelidlessness <eyelidlessness@users.noreply.github.com> Co-authored-by: Abdullah Mzaien <s201540830@kfupm.edu.sa> * feat(create-astro): add Solid support * docs: add JSX options to renderer reference * chore: add changeset for P/React renderers * fix: move react/server.js to external * chore: remove brewfile * Revert "feat: add support for `jsxImportSource`, new JSX transform" This reverts commit 077c4bfc135c58a85d4ebfca6012e90403694d8d. * fix: remove `react-dom/server` from `external` * chore: remove unused dependency * feat: improve JSX error messages * Revert "Revert "feat: add support for `jsxImportSource`, new JSX transform"" This reverts commit f6c2896b9ec6430611fc0abae7d586c42aca87e5. * docs: update jsxImportSource * feat: improve error message * feat: improve error logging for JSX renderers * tests: add jsx-runtime tests * chore: update snowpack Co-authored-by: eyelidlessness <eyelidlessness@users.noreply.github.com> Co-authored-by: Abdullah Mzaien <s201540830@kfupm.edu.sa>
38 lines
706 B
Markdown
38 lines
706 B
Markdown
# Using React with Astro
|
|
|
|
This example showcases Astro's built-in support for [React](https://reactjs.org/).
|
|
|
|
## Installation
|
|
|
|
### Automatic
|
|
|
|
Bootstrap your Astro project with this template!
|
|
|
|
```shell
|
|
npm init astro -- --template framework-react
|
|
```
|
|
|
|
### Manual
|
|
|
|
To use React components in your Astro project:
|
|
|
|
1. Install `@astrojs/renderer-react`
|
|
|
|
```shell
|
|
npm i @astrojs/renderer-react
|
|
```
|
|
|
|
2. Add `"@astrojs/renderer-react"` to your `renderers` in `astro.config.mjs`.
|
|
|
|
```js
|
|
export default {
|
|
renderers: [
|
|
"@astrojs/renderer-react",
|
|
// optionally, others...
|
|
]
|
|
}
|
|
```
|
|
|
|
## Usage
|
|
|
|
Write your React components as `.jsx` or `.tsx` files in your project.
|