summaryrefslogtreecommitdiff
path: root/examples/framework-preact/README.md
blob: 5302fa9dbb533cdc3caabaf434396b5abda25d13 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
# Using Preact with Astro

This example showcases Astro's built-in support for [Preact](https://www.preactjs.com/).

## Installation

### Automatic

Bootstrap your Astro project with this template!

```shell
npm init astro -- --template framework-preact
```

### Manual

To use Preact components in your Astro project:

1. Install `@astrojs/renderer-preact`

    ```shell
    npm i @astrojs/renderer-preact
    ```

2. Add `"@astrojs/renderer-preact"` to your `renderers` in `astro.config.mjs`.

    ```js
    export default {
      renderers: [
        "@astrojs/renderer-preact",
        // optionally, others...
      ]
    }
    ```

## Usage

Write your Preact components as `.jsx` or `.tsx` files in your project.