Skip to content

Commit

Permalink
Source map support.
Browse files Browse the repository at this point in the history
Closes #2.
  • Loading branch information
dfreeman committed Nov 6, 2016
1 parent 954121c commit e74af21
Show file tree
Hide file tree
Showing 6 changed files with 51 additions and 2 deletions.
15 changes: 15 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down
5 changes: 5 additions & 0 deletions ember-cli-build.js
Original file line number Diff line number Diff line change
Expand Up @@ -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': {
Expand Down
17 changes: 17 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
};
2 changes: 2 additions & 0 deletions lib/modules-preprocessor.js
Original file line number Diff line number Diff line change
Expand Up @@ -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(),
Expand Down
12 changes: 11 additions & 1 deletion lib/output-styles-preprocessor.js
Original file line number Diff line number Diff line change
Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down

0 comments on commit e74af21

Please sign in to comment.