8

查看 Monaco 示例和类型，看起来可以通过defineThemeAPI 配置主题。我正在尝试将 VSCode 主题应用于 Monaco 实例，并且正在努力设置背景颜色（对于整个编辑器，而不仅仅是令牌）。

规则被定义为具有此形状的对象数组：

IThemeRule {
    token: string;
    foreground?: string;
    background?: string;
    fontStyle?: string;
}

token设置编辑器背景应该是什么？

更一般地说，有没有一种很好的方法可以将此主题应用于摩纳哥实例，而无需从 VSCode 源中删除主题解析逻辑？在快速尝试删除逻辑之后，似乎一个简单的自定义解析器（即解析 JSON 主题定义 -> IThemeRules 的平面列表）是更好的方法。

4

2 回答 2

7

您可以定义自己的主题并更改editor.background颜色选项

monaco.editor.defineTheme('my-dark', {
        ...,
        colors: {
          "editor.background": '#394555'
        }
      });
于 2018-10-03T05:05:23.860 回答
5

你可以像这样定义你的主题

const theme = {
  base: 'vs', 
  inherit: true,
  rules: [
    { token: 'custom-info', foreground: 'a3a7a9', background: 'ffffff' },
    { token: 'custom-error', foreground: 'ee4444' },
    { token: 'custom-notice', foreground: '1055af' },
    { token: 'custom-date', foreground: '20aa20' },
  ]
}

然后像这样应用它

monaco.editor.defineTheme('myTheme', theme)

var editor = monaco.editor.create(document.getElementById('container'), {
    value: getCode(),
    language: 'myCustomLanguage',
    theme: 'myTheme'
});
于 2017-10-25T19:51:55.247 回答