摩纳哥编辑器以编程方式设置范围文本颜色,在 style.css 中没有 css

monaco editor set range text color programatically without css in style.css

我正在尝试使用 Monaco 编辑器创建用于简单文本处理的应用程序 (例如:select 一段文字,改变它的前景色和背景色)。 是否有捷径可寻?甚至最好,有没有像 Grammarly 这样最好的免费开源富文本,我只需要一些带颜色的降价功能。

此示例使用 CSS class 名称,但不是我要查找的名称。 https://microsoft.github.io/monaco-editor/playground.html#interacting-with-the-editor-line-and-inline-decorations CSS 是预定义的,不是动态生成的。

谢谢

实际上我的解决方案仍然使用 deltaDecorations 就像官方的 playground 示例。

但在实践中,您可以使用sass迭代来加速创建批处理样式,下面是我的真实项目代码,仅供参考:

  $palette: (
    '30': rgba(0,0,0,1),
    '31': rgba(247,49,49,1),
    '32': rgba(127,202,84,1),
    '33': rgba(246,222,84,1),
    '34': rgba(0,0,255,1),
    '35': rgba(255,0,255,1),
    '36': rgba(0,255,255,1),
    '37': rgba(255,255,255,1),
    '90': rgba(128,128,128,1),
    '40': rgba(0,0,0,1),
    '41': rgba(247,49,49,1),
    '42': rgba(127,202,84,1),
    '43': rgba(246,222,84,1),
    '44': rgba(0,0,255,1),
    '45': rgba(255,0,255,1),
    '46': rgba(0,255,255,1),
    '47': rgba(255,255,255,1),
  );
  @each $key, $color in $palette {
    :deep(.monaco-color-#{$key}) {
      color: $color;
    }
  }