如何定义TypeScript嵌套翻译对象类型以支持链式属性访问

1. 你给翻译对象手动标注了宽类型AppMessages，该类型的索引签名规定每个键的返回值为string | AppMessages，TypeScript无法自动识别中间层级的具体类型，默认会提示你该值可能为字符串，不存在嵌套属性。
2. 你示例访问代码里存在拼写错误：定义的键为actionButtons，访问时写的是actionsButton，也会触发类型报错。

使用satisfies操作符，既可以校验你的翻译对象符合AppMessages结构约束，又不会丢失对象本身的精确类型推导：

interface AppMessages extends Record<string, string | AppMessages> {}

// 使用satisfies替换原有的类型注解
const fr = {
  builder: {
    actionButtons: {
      preview: 'Visualisation',
    },
  },
} satisfies AppMessages;

// 现在访问嵌套属性不会报错，TS可自动推导preview为string类型
const test = fr.builder.actionButtons.preview;

如果你的TS版本低于4.9，可以用泛型校验+as const的方案实现同样效果：

type ValidateTranslation<T> = T extends Record<string, string | ValidateTranslation<T>> ? T : never;

// as const保留对象字面量的精确类型
const fr = {
  builder: {
    actionButtons: {
      preview: 'Visualisation',
    },
  },
} as const;

// 这里如果fr不符合翻译结构约定，TS会直接抛出类型错误
type _FrValidation = ValidateTranslation<typeof fr>;

// 同样可以正常访问嵌套属性，获得精确类型提示
const test = fr.builder.actionButtons.preview;

如果你不想改动现有类型定义，也可以在访问中间层级时手动加类型断言：

const test = (fr.builder as AppMessages).actionButtons.preview;

该方案缺点是需要每次访问嵌套层都手动断言，没有自动类型校验，容易出错。

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