11

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

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

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

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

我已经尝试过 Less,它是 Less、Sass 和 Stylus 三重奏中唯一一个目前在客户端工作得很好。那么,有没有人知道 Stylus 的好解决方案?

4

4 回答 4

4

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

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

现在,我的建议是仅部署编译后的 CSS,并在开发中使用诸如 watch 或 guard 或 live-reload 或 codekit(或任何合适的等效文件观察器)之类的东西,以便在编写代码时重新编译您的手写笔文件。

于 2012-07-06T06:15:11.547 回答
4

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

它似乎正在即时编译 Stylus。

于 2014-10-08T17:23:30.763 回答
2

Stylus 能够在浏览器中运行

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

于 2014-12-24T23:16:49.803 回答
0

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

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

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

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

我现在使用的应用程序称为 simpless http://wearekiss.com/simpless,它会即时创建有效的 css,所以只要我点击了崇高文本中的保存并在浏览器中刷新,我就可以看到我的更改的CSS。

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

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

干杯,斯特凡

于 2012-07-05T23:30:56.853 回答