dotless/dotless

.NET Port of the ruby Less CSS lib

Lauri Kotilainen

@rytmis

What does that do, then?

dimtabu

@taburetkin

you know there is bem methodology in development

Lauri Kotilainen

@rytmis

Sure, yeah.

dimtabu

@taburetkin

assume i have this file structure

app
    control1
        control1.js
        control1.html
        control1.less
    control2
        control2.js
        control2.html
        control2.less

and so one
so i allready can bundle js - its native
i have own bundle for html templates, its simple
and i have to get the last one - less bundle for that purpose

now i can do that

            var cssbundle = new SmartLessBundle("~/bundles/css/")
            .NonOrdering()
            .Include("~/Content/bootstrap/bootstrap.less",new SmartLessFileTransform())
            .Include("~/Content/font-awesome/less/font-awesome.less", new SmartLessFileTransform())
            .IncludeDirectory("~/Content/less", "*.less", true)
            .IncludeDirectory("~/app/v01", "*.less", true);

Smartbundle do compile once, after all files are joined

dimtabu

@taburetkin

its very raw, thats why i include file transform in bootstrap.less and font-awesom,
filetransform normilizes import directives inside less files via regex
and i asume that i dont use import directive at all in my own less files

but it do the trick

Lauri Kotilainen

@rytmis

So that does what, concatenates your files together and then runs the transform on them?

dimtabu

@taburetkin

yap, once

Lauri Kotilainen

@rytmis

Alright.

dimtabu

@taburetkin

i often saw questions on stackoverflow about "why my variables are missing if i include few less files in bundle"
so, i start to look for updates of dotless and found that there is no news from 2015 :))

Daniel Hoelbling-Inzko

@Tigraine

Same goes for me - I haven't worked in the .NET space for 6 years now so I mostly try to look after the community and invite people to contribute.. But besides from @rytmis not a lot has happened in the last year or so..
And the codebase is not really the greatest of them all - it's now a pretty straight port from the less.js implementation (at least it was 3-4 years ago) so that's where the regex stuff came from..

Lauri Kotilainen

@rytmis

I've copied over 532 tests from the dotless codebase and I've got 180 of them currently passing with my ANTLR-based implementation. There are a lot of things I haven't yet given thought to -- such as keeping track of source lines, output compression, you name it. But I'm concentrating now on getting the basic parser-evaluator step to a decent shape.

One of the key things I'm trying to do differently is mixin and variable scoping. I'm trying to make this work so that the evaluation step will store all of them in a way that allows for fast lookups.

Some of the freakier parts of dotless that are scary to touch are: selector generation (combinatorial explosion with parent selectors), extenders and media bubbling. All of those seem sort of bolted-on. I'm aiming for an evaluation model that would be easier to follow.

Daniel Hoelbling-Inzko

@Tigraine

I'd suggest checking the less.js code - how they built it there.. Because I think if they improved these parts we could see how they did it

Because James rewrote the dotless parser some years back to be a pretty 1:1 port of the JS codebase

Lauri Kotilainen

@rytmis

I did consider that, but right now, I find it more motivating to hack with the new parser. :)

Booster2ooo

@Booster2ooo

Thanks a lot for your efforts Lauri, the dotLess project is a super nice idea, keep on rocking!

Daniel Hoelbling-Inzko

@Tigraine

hehe :) more power to you Lauri :) I started out 2-3 times with a new antlr parser but always gave up as less is a pretty ugly to parse imo :)

Lauri Kotilainen

@rytmis

What was it that made you turn back, @Tigraine?

I mean, this is like the 3rd or 4th time I'm doing this, too, but for me it's always been a question of "I don't really know how to do this at the moment", and this time feels a bit different in that regard.

Lauri Kotilainen

@rytmis

I confess I cheated. I found a pre-made Less grammar and used it as a starting point. :)

Turns out, though, that it was woefully incomplete in many regards. Lots of special cases to deal with, but I'm slowly getting the hang of things.

Lauri Kotilainen

@rytmis

219 tests passing. I wanted to approach this on a feature-by-feature basis, but the tests in the dotless spec suite are fairly cross-cutting in nature -- e.g. a media block test fails because my parser doesn't understand other at-rules and so on.

Lauri Kotilainen

@rytmis

250 tests and my grammar is actually simplifying somewhat. Yay.

andersnm

@andersnm

Lauri Kotilainen

@rytmis

Hey

What's up, @andersnm?

andersnm

@andersnm

Work! =)

@rytmis How many tests are passing now? :)

Lauri Kotilainen

@rytmis

I think I'm up to something like 370

andersnm

@andersnm

cool

Lauri Kotilainen

@rytmis

Haven't done anything in a while now -- I'd need to implement all kinds of functions and such, and that's a bit more tedious. But I will!

I'm waiting for the moment when I can actually start compiling stuff like Bootstrap with it to see how close I am to actual parity

The reason I really like this approach is that it's far easier, I think, to assess the impact of new features on the parser, when you can "just" alter the grammar and see what happens.

Of course, it would help if this weren't my first time doing something in ANTLR...

andersnm

@andersnm

gotta start somewhere

been using re2c/lemon for all my parsing needs so far

Lauri Kotilainen

@rytmis

I would not be anywhere close to this far along were it not for the pre-existing (albeit incomplete) LESS grammar file I found.

andersnm

@andersnm

So, do you have your work in a repo so far, or is it still in the experimental phase?

Just curious though, don't think I'll dive into those parts anytime soon ; )

Lauri Kotilainen

@rytmis

I do

https://github.com/rytmis/lesson.net

It's very raw at the moment, and it's proably not very performant because I use generated enumerators everywhere

andersnm

@andersnm

ah sweet

Lauri Kotilainen

@rytmis

My aim was to have a sane, uniform API and evaluation model, and in particular to reduce the need for evaluating selectors again and again everywhere

andersnm

@andersnm

Looks clean

Lauri Kotilainen

@rytmis

Although I did intentionally make it less powerful than dotless in one regard: in dotless, when generating dynamic selectors, I re-parse the generated CSS to be able to invoke them as mixins. But that doesn't really make sense for things like .foo ~".bar .baz" -- you wouldn't actually expect that to be invokable as less, yet in dotless 1.5 it is. I did it back then because it was the only simple way to make generated selectors to work at all.

I mean, the case I had in mind when doing that was actually extending Bootstrap's generated column classes. But you couldn't do that, because they were generated, so the extenders never matched during the evaluation phase.

Where communities thrive

People

Repo info

Activity