Task/fp 1499 ui pattern demo - fix css import paths

package.json

@@ -64,7 +64,7 @@
     "// postcss-preset-env": "Using bleeding edge because https://github.com/csstools/postcss-plugins/issues/481#issuecomment-1334903391",
     "postcss-replace": "To edit relative paths to fonts"
   },
-  "devDependencies": {
+  "peerDependencies": {
     "@frctl/fractal": "^1.5.15",
     "@frctl/handlebars": "^1.2.15",
     "@frctl/mandelbrot": "^1.10.1",

src/.postcssrc.base.yml

@@ -1,7 +1,5 @@
 plugins:
-  postcss-import:
-    path:
-      - 'src/lib'
+  postcss-import: {}
 
   postcss-extend: {}
 

src/bin/config.js

@@ -33,8 +33,9 @@ function config(customConfigFiles = [], cssVersion) {
   });
   const mergedJson = merge(...configObjects);
 
-  // Update version property
-  const updatedJson = updateVersion(mergedJson, cssVersion);
+  // Update properties
+  let updatedJson = updateVersion(mergedJson, cssVersion);
+  updatedJson = resolveImportFromPaths(updatedJson);
   const configYaml = yaml.dump(updatedJson);
 
   // Write final config file
@@ -55,6 +56,38 @@ function updateVersion(config, version) {
   return config;
 }
 
+/**
+ * Update the value for the CSS version in given config data
+ * @param {object} config - The config data in which to update the version
+ * @return {object} - Updated config
+ */
+function resolveImportFromPaths(config) {
+  let paths = config['plugins']['postcss-env-function']['importFrom'];
+      paths = (typeof paths === 'string') ? [ paths ] : paths;
+  let newPaths = [];
+
+  console.log(`Resolving 'importFrom' paths`);
+
+  if (paths) {
+    paths.forEach(path => {
+      let newPath;
+      try {
+        newPath = require.resolve(path);
+      } catch {
+        newPath = path;
+      } finally {
+        newPaths.push( newPath );
+      }
+    });
+  } else {
+    newPaths = paths;
+  }
+
+  config['plugins']['postcss-env-function']['importFrom'] = newPaths;
+
+  return config;
+}
+
 /**
  * Get JSON from YAML config file
  * @param {string} filePath - YAML config file