如何使用javascript编译嵌套的css规则

Question

我需要一些帮助，用JavaScript创建自己的css编译器。

如何编译编译此嵌套规则的编译器示例：

html{
    background: #2E2E2E;
    body{
        height: 200px;
        width: 100%;
        background: #fff;
        a{
            color: rgb(0, 0, 255);
            &:hover{
                color: rgb(200, 0, 255);
            }
        }
    }
}

进入：

html{
    background: #2E2E2E;
}
html body{
    height: 200px;
    width: 100%;
    background: #fff;
}
html body a{
    color: rgb(0, 0, 255);
}
html body a:hover{
    color: rgb(200, 0, 255);
}

感谢您的帮助！

如果你投票，请告诉我原因。

Answer 1

我首先要提到构建自己的css编译器并不是一个笑话。这是一件严肃的事。你应该使用像Sass，Less或Stylus这样的东西。如果他们缺少您需要的功能，您应该为他们构建一个插件，而不是尝试实现自己的引擎。

话虽如此，您问题的答案可能是reworkcss。这是一个人们用来制作自己的CSS编译器的项目。