TypeScript允许访问接口未定义键？如何强制触发编译报错？

问题场景 #

我有如下代码：

const _quantity = startPaymentFrontend?.products[productSlug]?.invoiceData?.[key2]

其中startPaymentFrontend?.products[productSlug]的类型为StartPaymentProduct，该接口定义如下：

export interface StartPaymentProduct {
    pricingOptionId?: string
    passTypeId?: string
    quantity: number
    eventTimes?: { [eventTimeId: string]: StartPaymentProductEventTime }
    invoiceItems?: { [key: string]: number }
    teamSlug: string
}

开发环境能识别该接口没有invoiceData字段（只有invoiceItems），但执行yarn build时TypeScript并未报错。我的tsconfig.json配置如下：

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": true,
        "skipLibCheck": true,
        "strict": true,
        "forceConsistentCasingInFileNames": true,
        "noEmit": false,
        "esModuleInterop": true,
        "module": "esnext",
        "moduleResolution": "node",
        "resolveJsonModule": true,
        "isolatedModules": true,
        "jsx": "preserve",
        "sourceMap": true,
        "importHelpers": true,
        "outDir": "./built"
    },
    "include": ["app/**/*", "index.d.ts", "index2.d.ts"],
    "exclude": ["node_modules"]
}

为什么TypeScript不报错？ #

• 可选链的特性：使用?.访问属性时，只要左侧值可能是undefined或null，TypeScript默认允许访问任何属性——哪怕接口里没定义，只会返回undefined，不会触发报错。
• strict模式不覆盖该场景：虽然开启了strict: true，但这套规则仅管控类型严格性（比如禁止隐式any、严格空检查），不包含“检查未定义属性访问”的逻辑。
• 类型推断不严谨：如果startPaymentFrontend?.products[productSlug]的实际类型不是严格的StartPaymentProduct，而是被推断成any、unknown或者带索引签名的宽泛类型，TypeScript也不会检查属性是否存在。

如何强制触发错误？ #

• 开启noPropertyAccessFromIndexSignature（TS 4.4+）：在tsconfig.json的compilerOptions里添加这个配置，它会严格检查接口未定义的属性访问：

  "compilerOptions": {
      // 其他原有配置
      "noPropertyAccessFromIndexSignature": true
  }
  

• 配合exactOptionalPropertyTypes（TS 4.4+）：这个选项会让可选属性的类型更严格，和严格空检查一起使用，能进一步增强未定义属性的检测能力。
• 确保类型定义严谨：检查startPaymentFrontend和products的类型，确认products是Record<string, StartPaymentProduct>这种严格类型，而非any或带额外索引签名的类型。
• 用类型断言明确类型：如果需要确保变量类型严格符合接口，可以手动断言：

  const product = startPaymentFrontend?.products[productSlug] as StartPaymentProduct;
  const _quantity = product?.invoiceData?.[key2]; // 此时会触发报错
  

• 启用strictPropertyInitialization：这个规则主要针对类属性，但能提升整体类型检查的严谨性，配合其他规则效果更好。

内容的提问来源于stack exchange，提问作者János