8eaabe2fb0
Fix all deploy button URLs in the Next.js repo to follow the following format: ``` https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/<EXAMPLE_NAME>&project-name=<EXAMPLE_NAME>&repository-name=<EXAMPLE_NAME> ``` The detailed docs for the Deploy Button can be found here: https://vercel.com/docs/more/deploy-button. Also updates legacy Vercel import flow URLs (starting with vercel.com/import or with vercel.com/new/project), to use the new vercel.com/new URLs. --- For example, for the `hello-world` example: The URL is https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world And the deploy button looks like this: [](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world) --- For reference, I used the following regexes to search for the incorrect URLs ``` \(https://vercel.com/import/git\?s=https://github.com/vercel/next.js/tree/canary/examples/(.*)\) \(https://vercel.com/import/git\?c=1&s=https://github.com/vercel/next.js/tree/canary/examples/([^&]*)(.*)\) \(https://vercel.com/import/project\?template=https://github.com/vercel/next.js/tree/canary/examples/(.*)\) https://vercel.com/import/git https://vercel.com/import/select-scope https://vercel.com/import https://vercel.com/new/project ```
23 lines
1.3 KiB
Markdown
23 lines
1.3 KiB
Markdown
# Preact example
|
|
|
|
This example uses [Preact](https://github.com/preactjs/preact) instead of React. It's a React like UI framework which is fast and small.
|
|
|
|
## How to use
|
|
|
|
Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
|
|
|
|
```bash
|
|
npx create-next-app --example using-preact using-preact-app
|
|
# or
|
|
yarn create next-app --example using-preact using-preact-app
|
|
```
|
|
|
|
Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
|
|
|
|
### Aliasing react -> preact
|
|
|
|
Using `preact` with `next.js` depends on aliasing react packages to preact ones (like `@preact/compat`). This is done directly in the [`package.json`](./package.json) dependencies.
|
|
|
|
### next-plugin-preact
|
|
|
|
This example was [updated](https://github.com/vercel/next.js/pull/18588) to use [`next-plugin-preact`](https://github.com/preactjs/next-plugin-preact) and now requires minimal configuration, if you want to add preact without a plugin, or see how it works, head to the previous [`next.config.js`](https://github.com/vercel/next.js/blob/629884af7d3ced97b8c2ec7aebdfb1a3a5d808f0/examples/using-preact/next.config.js).
|