absurd
absurd copied to clipboard
krasimir
Generate source map for CSS preprocessing
Source map is needed so the developers could find the exact styles in a specific js file.
I'm interested in this and may try to drum something up to resolve the source map issue. @krasimir do you have any ideas on where to start?
Hi, this one is staying in my Inbox but I didn't have time to start working on it. I'm glad that someone is interested. Here are two links that I have bookmarked related to this issue:
https://developer.chrome.com/devtools/docs/css-preprocessors http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/
I was literally just looking at those two links.
Seems like exposing line numbers in Node is a bit complicated - I've played around with the stacktrace method before. But I have fears that it will be terribly slow and memory heavy based on the number of rules that the average stylesheet has.
The other thought I had was an optional source map rule - if Absurd finds it, it adds it to the sourcemap based whatever you pass to it. It would help in debugging tricky issues, but wouldn't clog the entire parsing step.
Thoughts?
It is indeed complicated. That's why I didn't start doing it I guess :) I thought about playing with http://esprima.org/ However, in our case if the developer use shortcuts for the properties this may be really really complex task.
I wasn't familiar with esprima, I may keep that in my back pocket. Talk about re-inventing the wheel though!
It's always fun to reinvent the wheel. I'll be really interested to see how it goes.
Has there been any work on this? It would be great to see the style line numbers in chrome inspector when making my styles. I feel like this is one of the few things stopping me from using this framework rather than just scss.
Hello @SkiftCreative,
the generation of source maps is easily achievable if we have AST representation of the code. However, Absurd is not transpiling and it is not dealing with AST transformations. It uses a custom JavaScript logic for generating the CSS which makes the source maps implementation difficult. This issue is opened for years without any actions on it but I'll try addressing this feature in the next months.
That would be awesome. I don't know enough about that part to help. I think having that could really help with adoption as well. Since it will make dev easier.
thanks.