Next.js에 Typescript 적용

Next js 프로젝트 생성 과정은 생략

• next가 추천하는 tsconfig 세팅을 사용하기 위해 root 디렉토리에 next-env.d.ts 파일 생성( tsconfig.json을 생성해도 상관없음)

touch tsconfig.json

• 생성 후 패키지 설치

yarn add --dev typescript @types/react @types/node

• 적용 확인
  root 디렉토리에 있는 pages 폴더 안에 _app.tsx 파일 생성 후 코드 삽입

import { AppProps } from 'next/app'

function App({ Component, pageProps }: AppProps) {
  return <Component {...pageProps} />
}

export default App

이 후 터미널에서 프로젝트 실행 중지 후 재 실행하면 tsconfig.json을 자동으로 생성해주고 자동으로 세팅 해줌
다시 https://localhost:3000/ 으로 접속하면 정상적으로 실행되는 것 확인 가능