Nuxt项目中无法检测TypeScript类型错误的问题求助

问题分析 #

你遇到的核心问题是：Nuxt默认仅对<script>标签内的TypeScript代码做校验，不会主动检查Vue模板中的表达式类型。即便在tsconfig.json中配置strict和noEmitOnError，也无法覆盖这一默认行为——因为模板的类型校验依赖Vue专用工具vue-tsc，而非原生TypeScript编译器。

解决步骤 #

1. 在Nuxt配置中启用类型检查 #

修改nuxt.config.ts，添加typescript配置项，强制开启全项目（包括模板）的类型校验：

export default defineNuxtConfig({
  typescript: {
    // 启用类型检查（自动调用vue-tsc扫描模板与脚本）
    typeCheck: true,
    // 开启严格类型校验规则
    strict: true,
    compilerOptions: {
      // 存在类型错误时禁止生成构建产物
      noEmitOnError: true
    }
  },
  // 保留你的原有配置（vite、i18n、Tailwind等）
})

2. 确保依赖安装 #

如果项目未安装vue-tsc，手动执行安装命令：

npm install -D vue-tsc

Nuxt 3.13+版本通常会自动关联依赖，但显式安装可避免版本兼容问题。

3. 修正tsconfig.json配置 #

保证你的tsconfig.json正确继承Nuxt生成的配置，同时维持严格模式：

{
  "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    "strict": true,
    "noEmitOnError": true,
    // 推荐使用ESNext替代es6，适配现代语法特性
    "lib": [
      "ESNext",
      "DOM"
    ]
  }
}

验证效果 #

完成配置后：

• 运行nuxt dev时，控制台会直接输出模板中的类型错误（比如greet()缺少必填参数的问题）；
• 运行nuxt build时，类型错误会终止构建流程，并在控制台提示具体错误信息。

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