merge

Author: dlmanning

README.md

@@ -44,9 +44,33 @@ Pass in your own callback to be called upon a sass error from node-sass. The cal
 
 ## Source Maps
 
-gulp-sass now generates *inline* source maps if you pass `sourceComments: 'map'` as an option. Note that gulp-sass won't actually do anything when passing `sourceMap: filepath`. Enjoy your source maps!
+gulp-sass can be used in tandem with [gulp-sourcemaps](https://github.com/floridoo/gulp-sourcemaps) to generate source maps for the SASS to CSS compilation. You will need to initialize [gulp-sourcemaps](https://github.com/floridoo/gulp-sourcemaps) prior to running the gulp-sass compiler and write the source maps after.
 
-NB: For those wondering, inline source maps are stuck onto the end of the css file instead of being in a separate map file. In this case, the original source contents are included as well, so you don't have to make sure your scss files are servable.
+```javascript
+var sourcemaps = require('gulp-sourcemaps');
+
+gulp.src('./scss/*.scss')
+  .pipe(sourcemaps.init());
+    .pipe(sass())
+  .pipe(sourcemaps.write())
+  .pipe('./css');
+
+// will write the source maps inline in the compiled CSS files
+```
+
+By default, [gulp-sourcemaps](https://github.com/floridoo/gulp-sourcemaps) writes the source maps inline in the compiled CSS files. To write them to a separate file, specify a relative file path in the `sourcemaps.write()` function.
+
+```javascript
+var sourcemaps = require('gulp-sourcemaps');
+
+gulp.src('./scss/*.scss')
+  .pipe(sourcemaps.init());
+    .pipe(sass())
+  .pipe(sourcemaps.write('./maps'))
+  .pipe('./css');
+
+// will write the source maps to ./dest/css/maps
+```
 
 #Imports and Partials
 

index.js

@@ -4,6 +4,7 @@ var fs    = require('fs')
   , path  = require('path')
   , gutil = require('gulp-util')
   , ext   = gutil.replaceExtension
+  , applySourceMap = require('vinyl-sourcemaps-apply')
   ;
 
 module.exports = function (options) {
@@ -20,6 +21,11 @@ module.exports = function (options) {
       return cb();
     }
 
+    if (file.sourceMap) {
+      opts.sourceComments = 'map';
+      opts.sourceMap = false;
+    }
+
     if (opts.sourceComments === 'map' || opts.sourceComments === 'normal') {
       opts.sourceMap = opts.sourceMap || '';
       opts.file = file.path;
@@ -41,12 +47,10 @@ module.exports = function (options) {
       if (typeof opts.onSuccess === 'function') opts.onSuccess(css, map);
 
       if (map) {
-        map = JSON.parse(map);
-        map.sourcesContent = getSourcesContent(map.sources);
-        sourceMap = new Buffer(JSON.stringify(map)).toString('base64');
-        css = css.replace(/\/\*# sourceMappingURL=.*\*\//,
-                          "/*# sourceMappingURL=data:application/json;base64," +
-                          sourceMap + "*/");
+        // hack to remove the already added sourceMappingURL from libsass
+        css = css.replace(/\n\/\*#\s*sourceMappingURL\=.*\*\//, '');
+
+        applySourceMap(file, map);
       }
 
       file.path      = ext(file.path, '.css');

package.json

@@ -23,7 +23,8 @@
   "dependencies": {
     "node-sass": "^0.9",
     "gulp-util": "^3.0",
-    "map-stream": "~0.1"
+    "map-stream": "~0.1",
+    "vinyl-sourcemaps-apply": "~0.1.1"
   },
   "devDependencies": {
     "tape": "~2.3",