Next.js - Typescript Support

Next.js 内置了 Typescript 支持。

首先，在项目根目录新建tsconfig.json，Next.js 会自动检测项目中的tsconfig.json文件，并将其解析为项目的配置。

接下来安装相关依赖

npm install -D typescript @types/react @types/node

启动服务

npm run dev

打开tsconfig.json，可以看到内容已经被Next.js修改

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "incremental": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve"
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

创建hello.ts

import {NextApiRequest, NextApiResponse} from 'next'
export default (req: NextApiRequest, res: NextApiResponse) => {
  res.status(200).json({
    message: 'Hello World'
  })
}