Monaco Editor使用addExtraLib添加带全局别名的命名空间后,全局变量自动补全失效问题求助
Monaco Editor使用addExtraLib添加带全局别名的命名空间后,全局变量自动补全失效问题求助
大家好,我最近在折腾给Monaco Editor集成Chai的类型定义,碰到个头疼的问题:@types/chai的类型文件里是在global命名空间下声明了Chai的命名空间,同时还导出了全局的assert、expect这些变量别名,但我把这个类型文件通过addExtraLib加入Monaco之后,全局的assert和expect完全没有自动补全提示,编辑器还会报错说找不到这些变量。
为了排查问题,我写了个极简的测试例子在Monaco Editor Playground里复现这个情况,结果同样的问题也出现了。下面是我的测试代码:
// 配置Monaco的TypeScript选项 monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({ noSemanticValidation: true, noSyntaxValidation: false, }); monaco.languages.typescript.javascriptDefaults.setCompilerOptions({ target: monaco.languages.typescript.ScriptTarget.ES2015, allowNonTsExtensions: true, }); // 自定义的类型声明文件内容 const libSource = [ "declare namespace Test {", " declare class Facts {", " /**", " * Returns the next fact", " */", " static next(): string;", " }", "}", "declare global {", " const Foo: Test.Facts;", "}", ].join("\n"); const libUri = "ts:filename/test-facts.d.ts"; // 添加额外的类型库 monaco.languages.typescript.javascriptDefaults.addExtraLib(libSource, libUri); monaco.editor.createModel(libSource, "typescript", monaco.Uri.parse(libUri)); // 测试用的JS代码 const jsCode = [ '"use strict";', "", "class Chuck {", " greet() {", " let works = Test.Facts.next() // 这里正常:能弹出next()方法的注释和补全", " let nope = Foo.next() // 这里不行:没有任何补全,还提示找不到Foo", " return works;", " }", "}", ].join("\n"); // 创建编辑器实例 monaco.editor.create(document.getElementById("container"), { value: jsCode, language: "javascript", });
可以看到,通过命名空间访问Test.Facts.next()完全正常,方法的JSDoc注释和补全都能出来,但直接用全局变量Foo的时候,编辑器完全识别不到它的类型,更别说补全了。
我试过调整compilerOptions里的各种配置,比如开启esModuleInterop、allowSyntheticDefaultImports,或者把ScriptTarget降到ES5,都没解决问题。有没有大佬遇到过类似的情况?或者知道怎么让Monaco正确识别通过declare global声明的全局变量类型?
内容来源于stack exchange
相关产品推荐
相关产品推荐

