手写笔 (CSS) 的客户端使用

Client side usage of Stylus (CSS)

本文关键字:客户端 CSS 手写笔      更新时间:2023-09-26

这里的新人。我一直在寻找使用Stylus(编译的CSS)客户端的好解决方案。

现在,我知道了有关不使用编译的CSS客户端的提示,因为:

  1. 如果不使用 JS,它会中断。
  2. 在实时客户端环境中编译需要额外的时间。
  3. 它需要在每个客户端上重新编译,这不是绿色的。

但是,我的环境是为Chrome和Opera制作的扩展。它在JS环境中工作并且离线工作,因此1,2或3都不适用。我在这里真正寻找的只是一种更高效地编写 CSS 的方法,更少的麻烦、更多的变量、嵌套和混合。

我已经尝试过Less,这是Less,Sass和Stylus三人组中唯一一个目前在客户端工作良好的产品。那么,有谁知道手写笔的好解决方案吗?

CSS 预处理器实际上并不是为了在客户端运行。一些工具(即 LESS)提供了一个开发时客户端 (JavaScript) 编译器,可以动态编译;但是,这不适用于生产。

事实上,Stylus/Sass 默认不提供这个实际上是一件好事,我个人希望 LESS 没有;然而,与此同时,我确实意识到拥有它为那些可能更喜欢拥有一些训练轮的人打开了大门,这些训练轮可以在开始时帮助他们。每个人都以不同的方式学习,所以这可能只是最初可以让某些人群进入大门的功能。因此,对于开发来说,这可能很好,但在撰写本文时,此工作流并不是生产中性能最高的操作。希望在某个时候,这些工具中的大多数有用功能将被添加到本机CSS中,那么这将是一个有争议的问题。

现在,我的建议是只部署编译的CSS,并在开发中使用watch或guard或实时重新加载或codekit(或任何合适的等效文件观察器)之类的东西,这样你的手写笔文件就会在你编码时被重新编译。

此页面可能有解决方案: http://learnboost.github.io/stylus/try.html

它似乎正在即时编译手写笔。

Stylus能够在浏览器中运行

GitHub 存储库中有一个可用的client分支

我不

完全理解你的问题,但我会提供一些我使用 LESS 编译 css 的经验。

早期的实现需要 javascript 在浏览器中将 LESS 文件编译为 CSS,我从未尝试过以这种方式工作对我来说似乎不是那么好,正如您所说,如果 JS 在一段艰难的时间内关闭了您的 in。

我最近一直在使用应用程序将 LESS 代码编译为有效的 CSS,这绕过了 JS 转换源代码的需要。

我使用的第一个应用程序是 crunch http://crunchapp.net/它运行良好,但没有即时编译 css。

我现在使用的应用程序称为simpless http://wearekiss.com/simpless,它会即时创建有效的css,因此一旦我点击以精美的文本保存并在浏览器中刷新,我就可以看到我对css的更改。

使用此工作流程,我能够解决您上面提出的问题,当我完成开发时,我只需上传从simpless输出的css文件,该文件也被大大缩小,这也节省了需要进一步优化css的时间。

我希望我正确理解了这个问题,如果不是道歉的话。

干杯斯特凡