Source map support.

Closes #2.

Author: dfreeman

README.md

@@ -416,6 +416,21 @@ new EmberApp(defaults, {
 });
 ```
 
+### Source Maps
+
+Ember CLI allows you to [specify source map settings](https://ember-cli.com/user-guide/#source-maps) for your entire build process, and ember-css-modules will honor that configuration. For instance, to enable source maps in all environments for both JS and CSS files, you could put the following in your `ember-cli-build.js`:
+
+```
+sourcemaps: {
+  enabled: true,
+  extensions: ['js', 'css']
+}
+```
+
+#### Notes
+- You should specify the `css` extension in your source map configuration even if you're using a different extension for your modules themselves, since the final output file will be a `.css` file.
+- Currently CSS source maps (for _any_ Ember CLI preprocessor) only work for applications, not for addons. Watch [ember-cli/broccoli-concat#58](https://github.com/ember-cli/broccoli-concat/issues/58) for progress on that front.
+
 ### Other Preprocessors
 
 There are two approaches to integrating CSS modules with other style preprocessors like Sass, Less or Stylus.

ember-cli-build.js

@@ -4,6 +4,11 @@ var EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
 
 module.exports = function(defaults) {
   var app = new EmberAddon(defaults, {
+    sourcemaps: {
+      extensions: ['js', 'css'],
+      enabled: true
+    },
+
     cssModules: {
       virtualModules: {
         'virtual-constants': {

index.js

@@ -100,7 +100,24 @@ module.exports = {
     return this.options.postcssOptions;
   },
 
+  enableSourceMaps: function() {
+    if (this._enableSourceMaps === undefined) {
+      var mapOptions = this._findRootApp().options.sourcemaps;
+      this._enableSourceMaps = mapOptions.enabled && mapOptions.extensions.indexOf('css') !== -1;
+    }
+
+    return this._enableSourceMaps;
+  },
+
   belongsToAddon: function() {
     return !!this.parent.parent;
+  },
+
+  _findRootApp: function() {
+    var current = this;
+    while (current.parent.parent) {
+      current = current.parent;
+    }
+    return current.app;
   }
 };

lib/modules-preprocessor.js

@@ -38,6 +38,8 @@ ModulesPreprocessor.prototype.toTree = function(inputTree, path) {
   this.modulesTree = require('broccoli-css-modules')(modulesSources, {
     extension: this.owner.getFileExtension(),
     plugins: this.getPlugins(),
+    enableSourceMaps: this.owner.enableSourceMaps(),
+    sourceMapBaseDir: this.owner.belongsToAddon() ? 'modules' : '',
     postcssOptions: this.owner.getPostcssOptions(),
     virtualModules: this.owner.getVirtualModules(),
     generateScopedName: this.scopedNameGenerator(),

lib/output-styles-preprocessor.js

@@ -18,7 +18,8 @@ OutputStylesPreprocessor.prototype.toTree = function(inputNode, inputPath, outpu
   var concatOptions = {
     inputFiles: ['**/*.' + this.owner.getFileExtension()],
     outputFile: outputFile,
-    allowNone: true
+    allowNone: true,
+    sourceMapConfig: this.sourceMapConfig()
   };
 
   debug('concatenating module stylesheets: %o', concatOptions);
@@ -114,6 +115,15 @@ OutputStylesPreprocessor.prototype.eachFileWithDependencies = function(type, cal
   });
 };
 
+OutputStylesPreprocessor.prototype.sourceMapConfig = function() {
+  if (this.owner.enableSourceMaps()) {
+    return {
+      extensions: ['css'],
+      mapCommentType: 'block'
+    };
+  }
+}
+
 // Pulled straight from broccoli-concat :(
 function makeIndex(a, b) {
   var index = Object.create(null);

package.json

@@ -50,7 +50,7 @@
   ],
   "dependencies": {
     "broccoli-concat": "^2.1.0",
-    "broccoli-css-modules": "^0.5.0",
+    "broccoli-css-modules": "^0.5.2",
     "broccoli-funnel": "^1.0.7",
     "broccoli-merge-trees": "^1.1.1",
     "debug": "^2.2.0",