Implement bundling files from @import statements.

systemjs · May 2, 2018 · 874f4fe · 874f4fe
1 parent 12e6185
commit 874f4fe
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 3 deletions.
diff --git a/css-plugin-base-builder.js b/css-plugin-base-builder.js
@@ -70,6 +70,7 @@ exports.bundle = function(loads, compileOpts, outputOpts) {
 
   var inputFiles = {};
   cssLoads.forEach(function(load) {
+    loader.builder = load.metadata.builder;
     inputFiles[path.relative(baseURLPath, fromFileURL(load.address))] = {
       source: load.metadata.style,
       sourceMap: load.metadata.styleSourceMap
@@ -83,12 +84,35 @@ exports.bundle = function(loads, compileOpts, outputOpts) {
   }
 
   var cwd = process.cwd();
+  var translate = loader.translate;
+  var instantiate = loader.instantiate;
+
+  loader.translate = function(load) {
+    return translate.call(this, load).then(function() {
+      if(load.metadata.style) {
+        inputFiles[path.relative(baseURLPath, fromFileURL(load.address))] = {
+          source: load.metadata.style,
+          sourceMap: load.metadata.styleSourceMap
+        };
+      }
+    });
+  };
+
+  loader.instantiate = function(load) {};
 
   var postCssPlugins = [atImport({
     resolve: function(fileName, dirname, opts) {
-      if (absUrl(fileName))
-        return fileName;
-      return path.relative(baseURLPath, path.join(dirname, fileName));
+      var resolved = fileName;
+      if (!absUrl(fileName)) {
+        fileName = path.join(dirname, fileName);
+        resolved = path.relative(baseURLPath, fileName);
+      }
+
+      return loader.import(fileName, module.id).then(function() {
+        return resolved;
+      }, function(err) {
+        return resolved;
+      });
     },
     load: function(fileName, opts) {
       if (absUrl(fileName))
@@ -157,6 +181,8 @@ exports.bundle = function(loads, compileOpts, outputOpts) {
   })
   .then(function(result) {
     var cssOutput = result.css;
+    loader.translate = translate;
+    loader.instantiate = instantiate;
 
     // write a separate CSS file if necessary
     if (loader.separateCSS) {

diff --git a/css-plugin-base.js b/css-plugin-base.js
@@ -16,6 +16,7 @@ function CSSPluginBase(compileCSS) {
 
     return Promise.resolve(compileCSS.call(loader, load.source, load.address, load.metadata.loaderOptions || {}))
     .then(function(result) {
+      Object.defineProperty(load.metadata, 'builder', { enumerable: false, value: loader.builder });
       load.metadata.style = result.css;
       load.metadata.styleSourceMap = result.map;
       if (result.moduleFormat)