S
S
Sergey2014-11-11 16:49:44
css
Sergey, 2014-11-11 16:49:44

Should I switch from Sass to Stylus?

1. Interested in what goodies stylus has in comparison with sass/compass.
For example, as I see from the tests, it is much faster than sass (but not libsass'a), flexible syntax out of the box - you want to write in the usual syntax, you want in a minimalistic one. Or import via if, which doesn't work in Sass.
2. What are the possible losses from such a transition?
For example, as I understood after reading about Stulus, it does not have a native (or in the form of an extension) assembly of sprites - for me this is very critical (but there is a grunt / gulp plugin, but they can also be used for Sass). On the other hand, it has an assembly of svg sprites (extension), which Sass does not have (compass).
PS I've been working on sass for more than 4 years, there are a lot of mixins, functions that make layout easier, but I don't think it will be a problem to transfer them to Stylus.
A very big problem is that WebStorm does not support the Stylus syntax very well (I played with the Stylus for half a day yesterday :))
PPS The principle of compiling css into Stylus is still incomprehensible.
In Sass, if you feed it an entire folder, it will compile all *.scss files, unless they start with "_", from all subfolders. And how is this the case in Stylus, I did not understand - how to make it clear what is possible and what should not be compiled?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
K
Konstantin Velichko, 2014-11-11
@Zoxon

1) The stylus has a nib instead of a compass, built-in functions. I use mostly functions to work with color and units.
The most important plus for me is that such code is easy to read and write, there is no all that garbage that is in css and sass.
When merging in git, a good plus is that the syntax is indented.
The stylus is faster not only in the tests, it does not need to pull ruby ​​and other crutches.
Essentially less, sass and css are a subset of the stylus language.
2) You are mistaken, there is an assembly of sprites and even a few, and you can always write your bike. But I do not use assembly, more reliable pens in Photoshop.
As far as I know, *storm products support the stylus, in fact, only the backlight is needed there. There are a lot of built-in functions and I doubt that you will immediately figure out where to use them, but without examples you won’t understand what for they are needed. On it we go to help and we read there.
Compiling how to set up a task manager, it's better to use gulp right away, it gives a big speed boost.
For example, this is how I compile the stylus in gulp

var gulp = require('gulp'),
stylus = require('gulp-stylus'),
nib = require('nib');

gulp.task('stylus', function() {
  gulp.src(['./source/css/**/*.styl', '!./source/css/lib/**/*.styl', '!./source/**/_*.styl'])
  .pipe(stylus({
    use: [nib()]
  }))
  .on('error', handleError)
  .pipe(gulp.dest('./public/css/'))
});

Files with the styl extension are processed in the /source/css/ folder and subfolders, excluding the lib folder and files starting with "_"
Well, I'll advertise my bike a little))
github.com/Zoxon/gulp-front

S
Sergey, 2014-11-12
@Hitta

Konstantin Velichko : As for me, syntax is a matter of habit. Personally, I don’t like the “clean” syntax - I experimented, looked at such a file, and realized that I would still use the full css syntax, because you need to make an effort to select a separate css block in the text footcloth (and that’s why I'm using scss, not sass). But in fact, these are trifles, and especially since both stylus and sass allow you to use both full and concise syntax, so I see no reason to argue here.
As for sprites, this was once the killer feature that led me to switch to sass. I no longer want to manually collect sprites. Now this is less relevant for the raster, since I switched to svg. But now I’m tired of manually collecting svg sprites (sass / compass can’t), save a png image for fallback (yes, I still have to support ie8), in fact, why I went to stylus, where there is such an opportunity.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question