1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/with-typescript
Justin Noel d6ec10a4bf add new nextjs typings with samples (#6102)
The current `examples/with-typescript` is not using the latest type definitions currently available on DefinitelyTyped project for next.

Added new list page examples that demonstrate how to use the new Types for both stateless functional components and classes.  Also modified examples for list to demonstrate typings for `getInitialProps`.
2019-01-23 12:37:09 +01:00
..
components add new nextjs typings with samples (#6102) 2019-01-23 12:37:09 +01:00
interfaces add new nextjs typings with samples (#6102) 2019-01-23 12:37:09 +01:00
pages add new nextjs typings with samples (#6102) 2019-01-23 12:37:09 +01:00
.babelrc Upgrade with-typescript to use latest next-typescript 2018-05-12 13:59:15 +02:00
next.config.js example/with-typescript (#3698) 2018-02-06 11:06:48 -05:00
package.json add new nextjs typings with samples (#6102) 2019-01-23 12:37:09 +01:00
README.md with-typescript example updates (#5267) 2018-09-26 09:58:36 +02:00
tsconfig.json with-typescript example updates (#5267) 2018-09-26 09:58:36 +02:00

Deploy to now

TypeScript Next.js example

This is a really simple project that show the usage of Next.js with TypeScript.

How to use it?

Using create-next-app

Execute create-next-app with Yarn or npx to bootstrap the example:

npx create-next-app --example with-typescript with-typescript-app
# or
yarn create next-app --example with-typescript with-typescript-app

Download manually

Download the example:

curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-typescript
cd with-typescript

Install it and run:

npm install
npm run dev
# or
yarn
yarn dev

The idea behind the example

Use the @zeit/next-typescript plugin to inject @babel/preset-typescript into Next.js, allowing for fast TypeScript transpilation. It also implements a tsconfig.json as recommended by the @zeit/next-typescript plugin page.

A type-check script is also added to package.json, which runs TypeScript's tsc CLI in noEmit mode to run type-checking separately. You can then include this in your test scripts, say, for your CI process.