only process changed files

packages/tools/components-package/nps.js

@@ -64,7 +64,7 @@ const getScripts = (options) => {
 			styles: {
 				default: 'concurrently "nps watch.styles.themes" "nps watch.styles.components"',
 				themes: 'nps "build.styles.themes -w"',
-				components: 'chokidar "src/themes/*.css" -c "nps build.styles.components"',
+				components: `node "${LIB}/watch-components-css/index.js" "src/themes/*.css"`,
 			},
 			templates: 'chokidar "src/**/*.hbs" -c "nps build.templates"',
 			samples: 'chokidar "test/**/*.sample.html" -c "nps build.samples"',

packages/tools/lib/watch-components-css/index.js

@@ -0,0 +1,34 @@
+const fs = require("fs");
+const chokidar = require("chokidar");
+const postcss = require("postcss");
+const postcssComponents = require("../../components-package/postcss.components");
+
+const srcFiles = process.argv[2];
+
+const run = path => {
+	fs.readFile(path, (err, css) => {
+		postcss(postcssComponents.plugins)
+			.process(css, { from: path })
+			.then(result => {
+				console.log("Processed: ", path);
+			});
+	});
+};
+
+let ready = false; // Do nothing until the ready event has been fired (we don't want to recompile all files initially)
+
+const watcher = chokidar.watch(srcFiles);
+
+watcher.on("ready", () => {
+	ready = true; // Initial scan is over -> waiting for changes or new files
+});
+watcher.on("add", path => {
+	if (ready) {
+		run(path);
+	}
+});
+watcher.on("change", path => {
+	if (ready) {
+		run(path);
+	}
+});

packages/tools/package.json

@@ -38,6 +38,7 @@
     "@wdio/sync": "^7.2.0",
     "@webcomponents/webcomponentsjs": "^2.5.0",
     "chai": "^4.3.4",
+    "chokidar": "^3.5.1",
     "chokidar-cli": "^2.1.0",
     "clean-css": "^5.1.1",
     "colors": "^1.4.0",

yarn.lock

@@ -2522,7 +2522,7 @@ [email protected]:
   optionalDependencies:
     fsevents "~2.1.2"
 
-[email protected], chokidar@^3.0.0, chokidar@^3.2.3, chokidar@^3.3.0, chokidar@^3.4.0, chokidar@^3.5.0:
+[email protected], chokidar@^3.0.0, chokidar@^3.2.3, chokidar@^3.3.0, chokidar@^3.4.0, chokidar@^3.5.0, chokidar@^3.5.1:
   version "3.5.1"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.1.tgz#ee9ce7bbebd2b79f49f304799d5468e31e14e68a"
   integrity sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==