feat: Use TypeScript Next.js config (next.config.ts)

[martin-eq]

Is your feature request related to a problem? Please describe.

It would be great to use TS as much as possible in the project, right now we are using env.js file because we import it in next.config.js

Newer versions of Next.js seem to support ESM in next.config.ts file.

Describe the solution you'd like to see

I suggest migrating from next.config.js to next.config.ts and to be able to convert env.js to env.ts as well.

Describe alternate solutions

The alternative is to continue using JS files with TS definitions in comments, but I don't think this is the cleaner approach.

Additional information

No response

[juliusmarminge]

Newer versions of Next.js seem to support ESM in next.config.ts file.

You have a source on this? Still fails on 15.2.4 for me when using ESM-only stuff:

[BinarySenseiii]

`
async function createNextConfig(): Promise {
const { createJiti } = await import('jiti')
const jiti = createJiti(fileURLToPath(import.meta.url))

// Import env or other files here, within the async function
await jiti.import('./src/constants/env.ts')

return {}, // next js configuration
}
}

export default (async () => withBundleAnalyzer(await createNextConfig()))()
`

here's the workaround... https://github.com/BinarySenseiii/next-clean/blob/main/next.config.ts
@martin-eq

[joachimjusth]

On version 15.3.0 of nextjs, it seems working without any issue. (also on 15.2.3)

Ct3A 7.39.3
node 23.11.0
pnpm 10.7.1
nextjs 15.3.0

The options I choose: (tailwind, trpc, next-auth, drizzle, biome)

I also tested with eslint instead of biome, also without any feature (tailwind, etc.).

Both next config and env file are in typescript.

Here is my next.config.ts

import type { NextConfig } from "next";

import "~/env";

const config: NextConfig = {
  eslint: { ignoreDuringBuilds: true },
  typescript: { ignoreBuildErrors: true },
};

export default config;

my env.ts is exactly the same generated by the CLI when I created the sandbox-tsfile project.

Also, I have a project deployed, at this time, on Vercel that use the next.config.ts and env.ts file, without any issue.