用JavaScript编写CSS

Sometimes programming is just using the right tool. This may be a framework, library or as it happens in my case CSS preprocessor. You probably don't realize it, but LESS or SASS have a lot of constraints. I managed to change that by writing my own CSS preprocessor. I stopped writing CSS and moved everything into the JavaScript world. This article is about AbsurdJS: a small Node.js module, which changed my workflow completely.

有时编程只是使用正确的工具。 这可能是框架，库，也可能是CSS预处理器。 您可能没有意识到，但是LESS或SASS有很多限制。 我设法通过编写自己CSS预处理程序来更改它。 我停止编写CSS，并将所有内容移入JavaScript世界。 本文是关于AbsurdJS的 ：一个小的Node.js模块，它完全改变了我的工作流程。

这个概念 (The Concept)

If you write a lot of CSS you probably use preprocessor. There are two popular - LESS and SASS. Both tools accept something, which looks like CSS, do some magic and export normal, pure CSS. What I did is just to replace the instrument and the input format. I didn't want to invent a new language or syntax, because this is connected with a lot of things like parsing and compiling. Thankfully, Node.js is here and I decided to use it. Also, I had a lot of LESS type projects, which means that I already use Node.js to compile my styles. It was much easier to replace a module instead of adding something completely new.

\

如果编写大量CSS，则可能使用预处理器。 流行有两种-LESS和SASS。 两种工具都可以接受类似于CSS的功能，可以执行一些魔术操作并输出普通的纯CSS。 我所做的只是替换乐器和输入格式。 我不想发明一种新的语言或语法，因为这与诸如解析和编译之类的许多事情有关。 幸运的是，Node.js在这里，我决定使用它。 另外，我有很多LESS类型的项目，这意味着我已经使用Node.js来编译我的样式。 更换模块比添加全新模块要容易得多。

\

输入 (The Input)

I think that the closest thing to the CSS format is JSON -- that's what AbsurdJS accepts. Of course there are some cons of this transformation. You have to put some properties in quotes and of course the values. This needs a little bit more time during the writing, but as you will see below it's worth it.

我认为最接近CSS格式的是JSON，这就是AbsurdJS所接受的。 当然，这种转变也有一些弊端。 您必须在引号中加上一些属性，当然还要在值中加上一些属性。 在编写过程中，这需要花费更多时间，但是您将在下面看到，这是值得的。

一开始是...一个JavaScript文件