rsnext/examples/with-vitest
ChanHui 8d45aa9bfb
update @types/react version in examples (#57259)
### What?
When I ran `npx create-next-app --example with-turbopack` and installed
dependencies using `yarn`, I found an typescript error(`'SomeComponent'
cannot be used as a JSX component.`).

<img
src="https://github.com/vercel/next.js/assets/51700274/f6c7e478-c0b1-4ea2-996f-4c0c78e3bb4b"
width=400 />

and I realized that the bug is due to the version of
@types/react(18.0.x).
you can check this issue on
[here](https://github.com/vercel/next.js/issues/42292#issuecomment-1594351684)
too.

### Why?
It seems that there is an error occurring in the @types/react version
18.0.x.

### How?
It would be good to change the @types/react version to 18.2.8 in the
next.js examples.

I think this change will resolve [this
issue](https://github.com/vercel/next.js/issues/55080#issue-1884846177)
[NestJS
documentation](https://nextjs.org/docs/app/building-your-application/configuring/typescript#async-server-component-typescript-error)
also states to upgrade the version.

Co-authored-by: Lee Robinson <me@leerob.io>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
2023-10-26 19:52:08 -05:00
..
__tests__ Update Jest and Vitest example for App Router. (#54989) 2023-09-05 13:31:47 +00:00
app Update Jest and Vitest example for App Router. (#54989) 2023-09-05 13:31:47 +00:00
pages Open deploy link in new window for examples (#40804) 2022-09-22 09:33:36 -07:00
public
styles
.gitignore Add .yarn/install-state.gz to .gitignore (#56637) 2023-10-18 16:34:48 +00:00
next-env.d.ts Remove incorrect entries for pnpm debug log (#47241) 2023-03-26 22:26:05 -07:00
package.json update @types/react version in examples (#57259) 2023-10-26 19:52:08 -05:00
README.md Update Jest and Vitest example for App Router. (#54989) 2023-09-05 13:31:47 +00:00
tsconfig.json
vitest.config.ts Remove unnecessary type reference in Vitest example (#39819) 2022-08-22 09:18:40 -05:00

Vitest

This example shows how to use Vitest with Next.js.

This includes Next.js' built-in support for Global CSS, CSS Modules and TypeScript. This example also shows how to use Vitest with the App Router and React Server Components.

Note: Since tests can be co-located alongside other files inside the App Router, we have placed those tests in app/ to demonstrate this behavior (which is different than pages/). You can still place all tests in __tests__ if you prefer.

Deploy your own

Deploy with Vercel

How to use

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example with-vitest with-vitest-app
yarn create next-app --example with-vitest with-vitest-app
pnpm create next-app --example with-vitest with-vitest-app

Deploy it to the cloud with Vercel (Documentation).

Running Tests

npm test