为摩纳哥编辑提供类型提示

Jon*_*n N 3 javascript typescript monaco-editor

我正在尝试使用Monaco编辑器将智能感知/代码完成提供到javascript编辑器中.代码需要是有效的javascript,而不是打字稿.

鉴于一些用户输入的脚本如下:

function onMyEvent(event)
{
    event.someProperty
}
Run Code Online (Sandbox Code Playgroud)

我想在event参数上提供代码完成,这是一个我有t.ds的typescript类,并且可以在运行时推断.

理想情况下,我只想告诉摩纳哥这种类型event是什么SomeEventClass,让它做其余的事情.即使这意味着向脚本添加类型提示.但我看不出怎么做.我尝试在用户脚本中使用JSDoc语法和各种组合,但看起来像阻止了FTB看到:https: //github.com/Microsoft/monaco-editor/issues/203为VSCode/Monaco Intellisence添加JavaScript类型提示

我也试过注入动态d.ts,按照 https://microsoft.github.io/monaco-editor/playground.html#extending-language-services-configure-javascript-defaults

但声明该功能似乎对编辑没有任何意义.声明一个新类肯定有效,我只是无法弄清楚如何告诉摩纳哥event该函数是一个特定的类型.

我可以看到registerCompletionItemProvider API,但是它没有给出任何声明项目声明等的上下文,也不允许我自动使用我想要的d.ts文件.

Jon*_*n N 5

从Monaco版本0.90开始,自https://github.com/Microsoft/monaco-editor/issues/203修复后,如果在编辑代码中使用JSDoc,则可以部分添加.

对于摩纳哥playgound左侧的代码:

    // validation settings
monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
    noSemanticValidation: true,
    noSyntaxValidation: false
});

// compiler options
monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
    target: monaco.languages.typescript.ScriptTarget.ES6,
    allowNonTsExtensions: true,
    allowJs: true
});

// extra libraries
monaco.languages.typescript.javascriptDefaults.addExtraLib([
    'declare class SomeEventType {',
    '    /**',
    '     * Heres the doco for someProperty',
    '     */',
    '    someProperty: string',
    '}',
].join('\n'), 'filename/facts.d.ts');

var jsCode = [
    '"use strict";',
    '',
    "/**",
    " * @param {SomeEventType} event",
    " */",
    "function onMyEvent(event) {",
    "",
    "}"
].join('\n');

monaco.editor.create(document.getElementById("container"), {
    value: jsCode,
    language: "javascript"
});
Run Code Online (Sandbox Code Playgroud)

意味着编辑器现在可以将事件参数解释为SomeEventType:

编辑器截图显示代码完整

  • 没有 jsDoc 注释是否有可能达到相同的结果?例如使用打字稿? (3认同)