如何使用Javascript删除Monaco Editor的自动完成功能？

Question

我在我的应用程序中嵌入了摩纳哥编辑器，我有一些javascript文件不应该显示“Web”环境的完成（想想Node.js或类似）我希望只为函数和类显示完成在页面上定义。

如何从javascript模式中删除所有“Web”自动填充功能？

Answer 1

这是一个很好的问题。这个Github问题涉及相同的主题：https://github.com/Microsoft/monaco-editor/issues/61。

根据这一点，通过将noLib传递给setCompilerOptions来禁用内置库：

monaco.languages.typescript.javascriptDefaults.setCompilerOptions({ noLib: true, allowNonTsExtensions: true });

您可以使用addExtraLib添加其他类型，这会挂起javascriptDefaults。 Typescript提供了一些d.ts文件，它们提供了ES5和ES6的基础知识，没有浏览器。下载其中一个并找到将其包含在项目中的方法。您需要将其作为字符串传递。

var coreDefsName = 'lib.es5.d.ts';

// Import the text of your chosen def file.  This will depend on your bundler.
var coreDefs = getResourceString('./' + coreDefsName);

// Register the additional library.
monaco.languages.typescript.javascriptDefaults.addExtraLib(
coreDefs,
coreDefsName
);

Answer 2

除noLibs以外，还有另一种方法。您也可以使用libs定义所需的默认库，而无需删除默认库的 all 。例如，您可能仍需要ES6库。

monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
  target: monaco.languages.typescript.ScriptTarget.ES2015,
  lib: ["es6"]
});

在CompilerOptions部分的Typescript文档中：

  

注意：

     

如果未指定--lib，则会注入默认的库列表。的   注入的默认库是：   对于--target ES5：DOM，ES5，ScriptHost   对于--target ES6：DOM，ES6，DOM.Iterable，ScriptHost

您可能想做的是省略DOM库。

请确保您将typescriptDefaults语言用于typescript，并将typescript.javascriptDefaults语言用于javascript。我认为它们基本上等同于摩纳哥。这使我绊了一会儿。

Answer 3

如果您在使用此库的 React JS 中使用它： https://www.npmjs.com/package/@monaco-editor/

从“@monaco-editor/react”导入编辑器

然后你可以写下以下几点来改变编辑器的行为：

<Editor
  height="90vh"
  defaultLanguage="javascript"
  defaultValue={code}
  options={{
    quickSuggestions: {
      other: false,
      comments: false,
      strings: false
    },
    parameterHints: {
      enabled: false
    },
    ordBasedSuggestions: false,
    suggestOnTriggerCharacters: false,
    acceptSuggestionOnEnter: "off",
    tabCompletion: "off",
    wordBasedSuggestions: false
  }}
/>

要查看可能的选项列表，请检查 IStandaloneEditorConstructionOptions