标签: monaco-editor

我在 GAS Web 编辑器中创建了一个新脚本，出于某种原因，我决定向该文件添加类型符号.gs：

当然，类型符号上有红色波浪线，但是String当我text在helloWorld.

虽然将鼠标悬停在波形文本上不会显示任何内容，但单击该行旁边的灯泡会为我提供一些ts忽略选项：

如果我尝试保存或运行代码，则会收到以下错误：

Syntax error: SyntaxError: Unexpected token ':' line: 7 file: Code.ts.gs

我知道打字稿可以在本地环境中用于开发 GAS，但 Web 编辑器的行为似乎表明那里可能有功能。我浏览了文档，但找不到有关此行为的任何内容。尽管

所以，我的问题是：这是一个功能还是一个错误？如果这是一项功能，我如何在网页编辑器中使用打字功能？它对于自动完成 GAS 库也非常有用！

以下代码片段可以与 React + Javascript 配合使用：

import React, { useRef } from "react";

import Editor from "@monaco-editor/react";

function App() {
  const editorRef = useRef(null);

  function handleEditorDidMount(editor, monaco) {
    editorRef.current = editor;
  }

  function showValue() {
    alert(editorRef.current?.getValue());
  }

  return (
    <>
      <button onClick={showValue}>Show value</button>
      <Editor
        height="90vh"
        defaultLanguage="javascript"
        defaultValue="// some comment"
        onMount={handleEditorDidMount}
      />
    </>
  );
}

export default App;

沙箱在这里。

我需要在 React + Typescript 应用程序中使用它，所以我必须添加类型。

应该用于什么类型editor？

尝试过这样的：

  function handleEditorDidMount(editor: HTMLInputElement) {
    editorRef?.current = editor;
  }

  function showValue() {
    // eslint-disable-next-line …

Monaco Diff Editor UX 允许用户使用两个窗格中间的调整器来调整原始窗格和修改后的窗格的大小。

• 是否可以在这些窗格的顶部添加标头（包含任何 HTML 元素的块元素），如下所示？它们应该包含在相应窗格的范围内，以便它们也可以调整大小。
• 如果无法添加标题，是否可以以编程方式读取各个窗格的宽度，以便伪造所需的行为？

我正在尝试将 Monaco Editor 用于 XML 语言，但在渲染编辑器实例时，XML 字符串没有被格式化，而它对于 JSON 工作正常。

我在编辑器的上下文菜单中也没有找到“格式化文档”选项（如果它是用 XML 语言打开的）。Monaco 编辑器默认支持 XML 格式吗？

我可以向编辑器添加字形，但无法删除和编辑字形。你能给我正确的方法吗？

<h2>Monaco Editor Sample</h2>
<div id="container" style="width:80%;height:600px;border:1px solid grey"></div>

<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script>
    var editor,decorations;
    require.config({ paths: { 'vs': '../node_modules/monaco-editor/min/vs' }});
    require(['vs/editor/editor.main'], function() {
         editor = monaco.editor.create(document.getElementById('container'), {
            value: [
                'function x() {',
                '\tconsole.log("Hello world!");',
                '}',
            ].join('\n'),
            language: 'javascript',
            theme: "myCustomTheme",
            automaticLayout: true,
            readOnly: false,
            mouseWheelZoom:true,
            glyphMargin:true,
            fontSize:'20px'
        });
   //below is the glyph I am calling
    var decorations = editor.deltaDecorations([], [     
    {
        range: new monaco.Range(3,1,3,1),
        options: …

我设法创建了行和内嵌装饰并将它们应用到编辑器，这是我用来创建装饰的代码：

editor.deltaDecorations([], myDecorations);

现在我正在寻找一种去除装饰的方法。

我尝试了 API 文档https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.itextmodelwithdecorations.html#getalldecorations中所述的 getAllDecorations ，但是当我尝试像这样使用它时：

var decs = editor.getAllDecorations();

我在浏览器的控制台中收到以下错误：

Uncaught TypeError: editor.getAllDecorations is not a function(…)

任何关于我做错了什么的建议将不胜感激！TIA

我无法向Monaco Editor添加自定义类型定义,其名称以@符号开头.这是一个例子,应该说明我想要实现的目标:

monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
    target: monaco.languages.typescript.ScriptTarget.ES2016,
    allowNonTsExtensions: true,
    module: monaco.languages.typescript.ModuleKind.CommonJS,
    noEmit: true,
    typeRoots: ["node_modules/@types"]
});

monaco.languages.typescript.typescriptDefaults.addExtraLib(
    "export class Foo { }",
    "node_modules/@types/@my-module/sub/index.d.ts"
);

monaco.editor.create(document.getElementById("container"), {
    model: monaco.editor.createModel(
        `import * as x from "@my-module/sub"`, 
        "typescript",
        new monaco.Uri("main.ts")
    )
});

这不起作用,因为我的自定义模块被调用@my-module/sub.如果在这个例子中我替换了模块名称,my-module/sub那么一切都按预期工作,我得到了Intellisense.你知道摩纳哥是否支持这种情况,如果是,那么这样做的正确方法是什么？显然,更改我的模块名称不是一个选项.

您可以在摩纳哥游乐场尝试这个片段.

我正在从 Codemirror 迁移到 Monaco 编辑器，以便我们使用前缀键输入特殊字符。例如，给定前缀.，如果用户键入.后跟o编辑器，则将序列替换为\xce\xa9。

可以使用 addCommand 并为其提供和弦，如下所示：

editor.addCommand(\n  monaco.KeyMod.chord(monaco.KeyCode.US_DOT , monaco.KeyCode.KEY_O),\n  x=>{ // write out special char here \n    editor.executeEdits("", [\n      { range: editor.getSelection(), text: "\xce\xa9" }\n    ]);\n  }\n)\n

但我想使用自动完成功能来帮助用户，在用户键入前缀键后列出特殊字符。CompletionItemProvider 允许我通过在 triggerCharacters 属性中提供前缀键来做到这一点：

monaco.languages.registerCompletionItemProvider(\'mylang\', {\n  triggerCharacters:[\'.\'],\n  provideCompletionItems: (model,position,token) => { \n    let l=position.lineNumber,c=position.column;\n    let s=model.getLineContent(l),ch=s[c-2];\n    console.log(\'completion triggered on: \'+ch)\n    if (ch===\'.\'){\n      return CompletionItem[]; // return list of valid special chars\n    }\n  }\n})\n

现在，当用户键入前缀键时，我会得到建议列表，但即使他使用o，它也不会触发，直到他通过按 Enter …