Custom NextJS Server with Typescript

This article was originally posted on my personal blog.


There is an official NextJS guide on how to create a custom server. However, it only works with JavaScript. Please follow their guide and come back.

https://nextjs.org/docs/advanced-features/custom-server


  1. Rename server.js to server.ts.

  2. Update the scripts in package.json

    "scripts": {
    "dev": "ts-node server.ts",
    "build": "next build",
    "start": "NODE_ENV=production ts-node server.ts"
    }
    
  3. Install ts-node

    yarn add ts-node
    
  4. Add this section in tsconfig.json

    {
      // ...
      "ts-node": {
        "transpileOnly": true,
        "compilerOptions": {
          "module": "commonjs"
        }
      }
    }