NextJS+TypeScript自定义服务器import调用报错问题求助

问题根源 #

Next.js的CommonJS模块通过require('next')导入时，默认导出就是createServer函数，但在ES模块的类型定义中，默认导出被包装成了一个包含default属性的对象（这是CommonJS转ES模块的兼容机制）。TypeScript的类型检查会严格遵循类型定义，所以直接调用next({dev})会提示“无调用签名”，尽管运行时实际能正常执行。

解决方法 #

1. 使用命名导入（推荐） #

直接导入createServer命名导出，符合TypeScript的模块规范：

import { createServer } from 'next';

const dev = process.env.NODE_ENV !== 'production';
const app = createServer({ dev });

2. 类型断言强制兼容 #

如果偏好默认导入的写法，可以通过类型断言告诉TypeScript该导出是可调用函数：

import next from 'next';

const dev = process.env.NODE_ENV !== 'production';
const app = (next as (options: { dev?: boolean }) => ReturnType<typeof import('next').createServer>)({ dev });

或者更简化的断言（适合快速调试）：

import next from 'next';

const dev = process.env.NODE_ENV !== 'production';
const app = (next as Function)({ dev });

3. 调整TypeScript配置（兼容方案） #

修改tsconfig.json的编译选项，让TypeScript更好地处理CommonJS模块的默认导出：

{
  "compilerOptions": {
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    // 其他原有配置...
  }
}

开启这两个选项后，import next from 'next'就能直接调用，但这种方式可能弱化类型检查的严格性，建议优先用前两种方法。

内容的提问来源于stack exchange，提问作者Sourabh