Performance issue fix

.eslintrc

@@ -18,7 +18,8 @@
     "import/extensions": "off",
     "import/prefer-default-export": "off",
     "no-restricted-globals": "off",
-    "no-underscore-dangle": "off"
+    "no-underscore-dangle": "off",
+    "import/no-extraneous-dependencies": "off"
   },
   "overrides": [
     {

scripts/build-styling.sh

@@ -2,13 +2,4 @@
 
 set -e
 
-sassfiles=(`find packages -name "*.scss"`)
-
-for sassfile in ${sassfiles[@]}; do
-  # skip partials
-  if [[ `basename ${sassfile}` =~ ^_ ]]; then
-    continue
-  fi
-  echo "Processing ${sassfile}"
-  node scripts/sass-render/bin/sass-render.js -t sass-template.tmpl -s ${sassfile}
-done
+node scripts/sass-render/bin/sass-render.js -t sass-template.tmpl -s 'packages/*/scss/*.scss'

scripts/sass-render/bin/sass-render.js

@@ -2,42 +2,43 @@
 
 const commandLineArgs = require('command-line-args');
 const commandLineUsage = require('command-line-usage');
-const {sassRender} = require('../index.js');
+const glob = require('glob');
+const { sassRender } = require('../index.js');
 
 const options = [
   {
     name: 'source',
     alias: 's',
     type: String,
     description: 'Template file to render sass into.',
-    defaultOption: true,
+    defaultOption: true
   },
   {
     name: 'template',
     alias: 't',
     type: String,
-    description: 'Template file to use, must use `<% content %>` as delimiter',
+    description: 'Template file to use, must use `<% content %>` as delimiter'
   },
   {
     name: 'help',
     alias: 'h',
     type: Boolean,
-    description: 'Print this message.',
-  },
+    description: 'Print this message.'
+  }
 ];
 
-const {source, template, help} = commandLineArgs(options);
+const { source, template, help } = commandLineArgs(options);
 
 function printUsage() {
   const sections = [
     {
       header: 'sass-render',
-      content: 'Render sass into an element\'s lit template',
+      content: "Render sass into an element's lit template"
     },
     {
       header: 'Options',
-      optionList: options,
-    },
+      optionList: options
+    }
   ];
   console.log(commandLineUsage(sections));
 }
@@ -53,7 +54,11 @@ if (!(source && template)) {
   process.exit(-1);
 }
 
-sassRender(source, template).catch((err) => {
-  console.error(err);
-  process.exit(-1);
+glob(source, (err, files) => {
+  files.forEach(file => {
+    sassRender(file, template).catch(error => {
+      console.error(error);
+      process.exit(-1);
+    });
+  });
 });

scripts/watcher.js

@@ -4,21 +4,17 @@ const exec = promisify(require('child_process').exec);
 
 const watchOptions = {
   recursive: true,
-  filter: (path) => {
+  filter: path => {
     if (path.indexOf('node_modules') > -1) {
       return false;
     }
     if (path.indexOf('scss') === -1) {
       return false;
     }
     return /.(?:scss)$/.test(path);
-  },
+  }
 };
 
-watch('packages', watchOptions, function(_event, fileName) {
-  addToQueue(fileName);
-});
-
 let updating = false;
 
 async function addToQueue(fileName) {
@@ -28,16 +24,22 @@ async function addToQueue(fileName) {
   console.log(`saw change to ${fileName}`);
   updating = true;
   console.log('building styles');
-  const execPromise = exec('npm run build');
+  const execPromise = exec(
+    `node scripts/sass-render/bin/sass-render.js -t sass-template.tmpl -s "${fileName}"`
+  );
   try {
-    const {stdout} = await execPromise;
+    const { stdout } = await execPromise;
     console.log(stdout);
-  } catch ({stdout, stderr}) {
+  } catch ({ stdout, stderr }) {
     console.log(stdout);
     console.log('ERROR:', stderr);
   }
   console.log('watcher build complete!');
   updating = false;
 }
 
+watch('packages', watchOptions, function(_event, fileName) {
+  addToQueue(fileName);
+});
+
 console.log('watcher started!');