not what I expected

Author: Alexey Litvinov

index.js

@@ -1,30 +1,130 @@
+const dirname = require('path').dirname;
+const forEach = require('lodash');
 const plugin = require('postcss').plugin;
+const postcss = require('postcss');
+const readFile = require('fs').readFile;
+const readFileSync = require('fs').readFileSync;
+const resolve = require('path').resolve;
 
 const importRegexp = /^:import\((.+)\)$/;
+const nameOfTheCurrentPlugin = 'postcss-modules-resolve-imports';
 
 /**
  * @param  {object}  [opts]
  * @param  {boolean} opts.sync
  * @return {function}
  */
-module.exports = plugin('postcss-modules-resolve-imports', function postcssModulesResolveImports(opts) {
-  return function resolveImports(css, result) {
+module.exports = plugin(nameOfTheCurrentPlugin, function postcssModulesResolveImports(opts) {
+  return function resolveImports(tree, result) {
     // https://github.com/postcss/postcss/blob/master/docs/api.md#inputfile
-    const filepath = css.source.input.file;
-    const plugins = result.processor.plugins;
+    // const filepath = tree.source.input.file;
+    const plugins = getPluginsForParse(result.processor.plugins);
+    const runner = postcss(plugins);
 
-    css.walkRules(importRegexp, rule => {
-      const dependency = RegExp.$1.replace(/^["']|["']$/g, '');
+    const cache = {};
+    const queue = [];
+    const traces = {};
 
-      // Шаги -> Резолвим путь -> Загружаем содержимое -> Прогоняем через postcss -> Достаем Root
-      // -> Резолвим зависимости -> Вставляем ноды в исходное дерево (желательно использовать tracesort)
-      // Получается, нужен кэш с файлами и конечный резолвер на случай, когда файлы загружены.
-      //
-      // По сути можно хранить список файлов и их контент + отдельно помечать глубину загрузки
+    traverseImports(tree, dependency =>
+      loadDependency(dependency, {cache, queue, runner}));
 
-      // path RegExp.$1
-    });
+    return Promise.all(queue)
+      .then(_ => combineTrees(tree, cache));
 
-    return css;
+    // -> traceKeySorter
   };
 });
+
+/**
+ * @param  {array} plugins
+ * @return {array}
+ */
+function getPluginsForParse(plugins) {
+  const pluginsForParse = plugins.slice();
+  let ln = pluginsForParse.length;
+
+  while (pluginsForParse[--ln].postcssPlugin !== nameOfTheCurrentPlugin) {
+    pluginsForParse.pop();
+  }
+
+  return pluginsForParse;
+}
+
+/**
+ * @param  {root}     tree
+ * @param  {function} iterator
+ */
+function traverseImports(tree, iterator) {
+  // https://github.com/postcss/postcss/blob/master/docs/api.md#inputfile
+  const source = tree.source.input.file;
+  // https://github.com/postcss/postcss/blob/master/docs/api.md#containerwalkrulesselectorfilter-callback
+  tree.walkRules(importRegexp, rule => {
+    iterator(getDepsPath(RegExp.$1, source), source);
+    tree.removeChild(rule);
+  });
+}
+
+/**
+ * @param  {string} to
+ * @param  {string} from
+ * @return {string}
+ */
+function getDepsPath(to, from) {
+  // @todo support non-relative imports
+  // const filepath = /\w/i.test(to[0])
+  //   ? require.resolve(to)
+  //   : resolve(dirname(from), to);
+  return resolve(dirname(from), to.replace(/^["']|["']$/g, ''));
+}
+
+/**
+ * @param  {string} dependency
+ * @param  {object} options.cache
+ * @param  {array}  options.queue
+ */
+function loadDependency(dependency, {cache, queue, runner}) {
+  const pending = new Promise((resolve, reject) =>
+    readFile(dependency, 'utf8', (er, source) => {
+      if (er) {
+        return void reject(er);
+      }
+
+      runner
+        .process(source, {from: dependency})
+        .then(result => {
+          cache[dependency] = result.root;
+
+          traverseImports(result.root, deps =>
+            loadDependency(deps, {cache, queue, runner}));
+
+          resolve(result.root);
+        })
+        .catch(reject);
+    }));
+
+  queue.push(pending);
+  return pending;
+}
+
+function combineTrees(root, cache) {
+  forEach(cache, tree => root.prepend.apply(root, tree.nodes));
+  console.log('test', root)
+  return root;
+}
+
+// Sorts dependencies in the following way:
+// AAA comes before AA and A
+// AB comes after AA and before A
+// All Bs come after all As
+// This ensures that the files are always returned in the following order:
+// - In the order they were required, except
+// - After all their dependencies
+function traceKeySorter(a, b) {
+  if (a.length < b.length) {
+    return a < b.substring(0, a.length) ? -1 : 1;
+  } else if (a.length > b.length) {
+    return a.substring(0, b.length) <= b ? -1 : 1;
+  } else {
+    return a < b ? -1 : 1;
+  }
+};

package.json

@@ -4,8 +4,9 @@
   "description": "Resolves ICSS imports",
   "main": "index.js",
   "scripts": {
-    "test": "npm run test:unit",
-    "test:unit": "mocha --require test/setup.js --ui tdd test/index.js"
+    "test": "npm run test:node",
+    "test:node": "$npm_package_scripts_test_unit --use_strict",
+    "test:unit": "mocha --require test/setup.js --ui tdd test/index.js --harmony_destructuring"
   },
   "repository": {
     "type": "git",
@@ -21,6 +22,7 @@
   },
   "homepage": "https://github.com/sullenor/postcss-modules-resolve-imports#readme",
   "dependencies": {
+    "lodash": "^4.6.1",
     "postcss": "^5.0.17"
   },
   "devDependencies": {

removeExports.js

@@ -0,0 +1,10 @@
+const plugin = require('postcss').plugin;
+
+const exportRegexp = /^:export$/;
+
+module.exports = plugin('remove-exports', function removeExports() {
+  return css => {
+    css.walkRules(exportRegexp, rule => css.removeChild(rule));
+    return css;
+  };
+});

test/index.js

@@ -4,14 +4,23 @@ const LocalByDefault = require('postcss-modules-local-by-default');
 const ExtractImports = require('postcss-modules-extract-imports');
 const Scope = require('postcss-modules-scope');
 const ResolveImports = require('../index.js');
+const RemoveExports = require('../removeExports');
 
 const readFileSync = require('fs').readFileSync;
 const resolve = require('path').resolve;
 
 const css = readFileSync(resolve('test/source.css'), 'utf8');
 
-const result = postcss([LocalByDefault, ExtractImports, Scope, ResolveImports])
+const result = postcss([
+  LocalByDefault,
+  ExtractImports,
+  Scope,
+  ResolveImports,
+  RemoveExports,
+])
   .process(css, {from: resolve('test/source.css')})
-  .css;
+  .then(result => {
+    // console.log(result.root);
+  });
 
 console.log(result);