Fixed async code accessing a variable after it has been changed.

Author: tjallingt

cmify.js

@@ -13,6 +13,7 @@ function Cmify(filename, opts) {
   this.cssExt = /\.css$/;
   this._data = "";
   this._filename = filename;
+  this._cssOutFilename = opts.cssOutFilename;
 }
 
 Cmify.prototype.isCssFile = function (filename) {

index.js

@@ -99,7 +99,7 @@ module.exports = function (browserify, options) {
 
   var cssOutFilename = options.output || options.o;
   var jsonOutFilename = options.json || options.jsonOutput;
-  var sourceKey = cssOutFilename;
+  transformOpts.cssOutFilename = cssOutFilename;
 
   // PostCSS plugins passed to FileSystemLoader
   var plugins = options.use || options.u;
@@ -142,16 +142,11 @@ module.exports = function (browserify, options) {
     return plugin;
   });
 
-  // get (or create) a loader for this entry file
-  var loader = loadersByFile[sourceKey];
-  if (!loader) {
-    loader = loadersByFile[sourceKey] = new FileSystemLoader(rootDir, plugins);
+  // create a loader for this entry file
+  if (!loadersByFile[cssOutFilename]) {
+    loadersByFile[cssOutFilename] = new FileSystemLoader(rootDir, plugins);
   }
 
-  // the compiled CSS stream needs to be avalible to the transform,
-  // but re-created on each bundle call.
-  var compiledCssStream;
-
   // TODO: clean this up so there's less scope crossing
   Cmify.prototype._flush = function (callback) {
     var self = this;
@@ -160,6 +155,9 @@ module.exports = function (browserify, options) {
     // only handle .css files
     if (!this.isCssFile(filename)) { return callback(); }
 
+    // grab the correct loader
+    var loader = loadersByFile[this._cssOutFilename];
+
     // convert css to js before pushing
     // reset the `tokensByFile` cache
     var relFilename = path.relative(rootDir, filename);
@@ -203,13 +201,14 @@ module.exports = function (browserify, options) {
 
   browserify.on('bundle', function (bundle) {
     // on each bundle, create a new stream b/c the old one might have ended
-    compiledCssStream = new ReadableStream();
+    var compiledCssStream = new ReadableStream();
     compiledCssStream._read = function () {};
 
     bundle.emit('css stream', compiledCssStream);
 
     bundle.on('end', function () {
       // Combine the collected sources for a single bundle into a single CSS file
+      var loader = loadersByFile[cssOutFilename];
       var css = loader.finalSource;
 
       // end the output stream