Monaco Editor无TypeScript字面量类型提示，如何配置实现VSCode同款效果？

要让Monaco Editor和VSCode一样支持TypeScript字面量联合类型的代码提示，需要通过配置TypeScript语言服务的偏好选项启用对应功能，具体步骤如下：

• 启用字面量类型补全偏好：初始化Monaco Editor前，设置TypeScript语言服务的includeCompletionsForLiteralTypes选项为true，该选项控制是否生成字面量类型的补全建议。
• 配置基础编译选项：开启严格模式等必要的TypeScript编译选项，确保语法检查和类型推断正常工作。

完整配置示例 #

// 配置TypeScript编译选项
monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
  target: monaco.languages.typescript.ScriptTarget.ESNext,
  strict: true,
  module: monaco.languages.typescript.ModuleKind.CommonJS
});

// 设置语言服务偏好，启用字面量补全
monaco.languages.typescript.typescriptDefaults.setLanguageServicePreferences({
  includeCompletionsForLiteralTypes: true,
  includeCompletionsForModuleExports: true
});

// 创建编辑器实例
const editor = monaco.editor.create(document.getElementById('editor-container'), {
  value: `declare const fn: (_: 'aaa' | 'bbb') => any;

fn("")`,
  language: 'typescript',
  theme: 'vs-dark'
});

说明 #

配置完成后，在fn("")的引号内输入内容时，Monaco Editor会自动弹出'aaa'和'bbb'的补全提示，与VSCode的表现一致。你当前使用的v0.52.0版本完全兼容该配置项（v0.20+版本已支持此功能）。

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