Source Maps

Would be awesome to have sourceMap support.

https://developers.google.com/chrome-developer-tools/docs/css-preprocessors#toc-css-preprocessor-support

@shannonmoeller

@shannonmoeller please correct me if I'm wrong but source maps are for CSS preprocessors only. And apparently clean-css makes smaller CSS from… larger CSS!

@imports

Source maps are for any JS or CSS files that are compiled from other source files. Because clean-css inlines @imports and modifies code to make it smaller than the source files, it qualifies! Consider your JS sister, uglifyjs. It only makes smaller JS files from larger JS files, and it supports generating source maps too!

Ah, sneaky @imports! Challenge accepted :-)

+1
Any news?

@Kienz

@Kienz we have some other tasks in the pipeline but we won't leave it unanswered. The more +1's the quicker we get into it.

+1 This will be one of the most useful feature.

+1, we'd prefer to use --clean-css from grunt less task, as it gives better results than --compress, but we need the source maps

@iki

@iki @sbspk looks like we need to push it higher on the priorities list. Could be 2.1 then.

@GoalSmashers

@GoalSmashers sounds great, count me in for testing if needed

@GoalSmashers

@GoalSmashers sounds awesome 👍 .

@iki

@iki @sbspk thanks, will do!

When doing it please could you consider allowing passing in a source sourcemap as well? Uglifjs also allows this and I think If you use mozillas sourcemap library (on node) then it allows integrating it. I implemented css sourcemap support for less and it would be great to allow less to use clean css to compress the css and transform the sourcemap too.

@lukeapage

@lukeapage You stole the words out of my mouth :D +1 for the suggestion.

@lukeapage

@lukeapage @sbspk Sure, I'll take a look into it!

I consider the initial version of source maps as ready for 3.0 unless someone finds any bug(s). 🍻

@jakubpawlowicz

give SASS + clean-css a try

@jakubpawlowicz sure, I'm trying to get to it, I just ran into some problems this eve: #563 #565

use target option pointing to a directory

When I changed root: srcDir to target: srcDir, I lost the whole source map, i.e. just an empty skeleton gets generated.

🍺 awesome! hope it ends up in the grunt-contrib-cssmin repo soon as well 👍

@naartjie

@naartjie would you be able to share your code? I can take a look later today.
@gerbenvandijk it would be great indeed!

I've been able to verify that SASS source maps work fine too. I'll merge the branch to master now so please open a new issue if you spot anything wrong about source maps.

I can also verify from my side, that SASS source maps in are working. Sorry it took a while.

👍 for merging it into master. Super cool.

Edit: just to be clear on this, I had to use version 3.0 of libsass for this to work, as it wasn't working on more recent libsass versions.

@naartjie

Great, thanks @naartjie for the feedback!

@naartjie

@naartjie would you be able to share your code? I can take a look later today.

Sure thing. Here is a self contained test, which should exemplify my understanding of it:

var fs = require('fs');
var CleanCss = require('clean-css');

fs.writeFileSync('./my.css', 'body {color:red;}');

var cleanCss = new CleanCss({ sourceMap: true, target: process.cwd() });
var out = cleanCss.minify('@import url(my.css)').sourceMap.toString();

// out = {"version":3,"sources":[],"names":[],"mappings":""}

I'm sure I'm just doing something silly, or misunderstanding your instructions somehow. Thanks for looking into it.

That's how you should do it, however you're missing a semicolon in import: '@import url(my.css);'.

missing a semicolon

Doh! that fixes it. Told you it was silly!! ;-) Thanks a mil!!

:-) Cheers!

Cheers!

rhymes with... 🍻

I'll sure have once 3.0 is out :-D

Navigation Menu

Repository navigation

Source Maps #125

139 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Source Maps #125

Description

Activity

GoalSmashers commented on Aug 8, 2013

shannonmoeller commented on Aug 9, 2013

GoalSmashers commented on Aug 9, 2013

Kienz commented on Oct 22, 2013

GoalSmashers commented on Oct 22, 2013

Subash commented on Nov 14, 2013

iki commented on Nov 15, 2013

GoalSmashers commented on Nov 15, 2013

iki commented on Nov 16, 2013

Subash commented on Nov 16, 2013

GoalSmashers commented on Nov 16, 2013

lukeapage commented on Nov 16, 2013

Subash commented on Nov 17, 2013

GoalSmashers commented on Nov 17, 2013

139 remaining items

jakubpawlowicz commented on Dec 8, 2014

naartjie commented on Dec 8, 2014

naartjie commented on Dec 8, 2014

gerbenvandijk commented on Dec 8, 2014

jakubpawlowicz commented on Dec 9, 2014

jakubpawlowicz commented on Dec 9, 2014

naartjie commented on Dec 10, 2014

jakubpawlowicz commented on Dec 10, 2014

naartjie commented on Dec 10, 2014

jakubpawlowicz commented on Dec 10, 2014

naartjie commented on Dec 10, 2014

jakubpawlowicz commented on Dec 10, 2014

naartjie commented on Dec 10, 2014

jakubpawlowicz commented on Dec 10, 2014

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions