如何在摩纳哥实现样式组件SCSS编辑器？

Question

我有一个组件，用户可以在其中编写自己的样式，这些样式直接注入到样式组件包装器中。

const Component = styled.div`
  ${({ containerStyle = "" }) => containerStyle}
`

如您所见，摩纳哥不支持没有任何选择器的顶级 CSS 属性：

如果我将 css 包装到选择器，它就可以正常工作。

如何让 Monaco 支持这种语法？

Answer 1

这个问题涉及的问题比你想象的要大。您所追求的是在摩纳哥支持一种新语言。这需要一个自己的解析器、自己的数据结构来将文档大纲保存在内存中（用于代码完成等）、自己的语法荧光笔等等。这不像是切换设置，摩纳哥会神奇地支持您的语言/方言。