chore: add watch command

package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "build": "node ./scripts/build.js",
     "build-clean": "rm -rf ./packages/*/build",
+    "watch": "node ./scripts/watch.js",
     "test": "jest",
     "lint": "eslint . --cache --report-unused-disable-directives",
     "flow-check": "flow check",

scripts/build.js

@@ -27,27 +27,20 @@ const chalk = require('chalk');
 const micromatch = require('micromatch');
 const prettier = require('prettier');
 const stringLength = require('string-length');
+const { PACKAGES_DIR, getPackages } = require('./helpers');
 
 const OK = chalk.reset.inverse.bold.green(' DONE ');
 const SRC_DIR = 'src';
 const BUILD_DIR = 'build';
 const JS_FILES_PATTERN = '**/*.js';
 const IGNORE_PATTERN = '**/__{tests,mocks,fixtures}__/**';
-const PACKAGES_DIR = path.resolve(__dirname, '../packages');
 
 const transformOptions = require('../babel.config.js');
 
 const prettierConfig = prettier.resolveConfig.sync(__filename);
 prettierConfig.trailingComma = 'none';
 prettierConfig.parser = 'babel';
 
-function getPackages() {
-  return fs
-    .readdirSync(PACKAGES_DIR)
-    .map(file => path.resolve(PACKAGES_DIR, file))
-    .filter(f => fs.lstatSync(path.resolve(f)).isDirectory());
-}
-
 const adjustToTerminalWidth = str => {
   const columns = process.stdout.columns || 80;
   const WIDTH = columns - stringLength(OK) + 1;

scripts/helpers.js

@@ -0,0 +1,16 @@
+const fs = require('fs');
+const path = require('path');
+
+const PACKAGES_DIR = path.resolve(__dirname, '../packages');
+
+function getPackages() {
+  return fs
+    .readdirSync(PACKAGES_DIR)
+    .map(file => path.resolve(PACKAGES_DIR, file))
+    .filter(f => fs.lstatSync(path.resolve(f)).isDirectory());
+}
+
+module.exports = {
+  getPackages,
+  PACKAGES_DIR,
+};

scripts/watch.js

@@ -0,0 +1,75 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates. All Rights Reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * Watch files for changes and rebuild (copy from 'src/' to `build/`) if changed
+ */
+
+const fs = require('fs');
+const { execSync } = require('child_process');
+const path = require('path');
+const chalk = require('chalk');
+const { getPackages } = require('./helpers');
+
+const BUILD_CMD = `node ${path.resolve(__dirname, './build.js')}`;
+
+let filesToBuild = new Map();
+
+const exists = filename => {
+  try {
+    return fs.statSync(filename).isFile();
+  } catch (e) {
+    // omit
+  }
+  return false;
+};
+const rebuild = filename => filesToBuild.set(filename, true);
+
+getPackages().forEach(p => {
+  const srcDir = path.resolve(p, 'src');
+  try {
+    fs.accessSync(srcDir, fs.F_OK);
+    fs.watch(path.resolve(p, 'src'), { recursive: true }, (event, filename) => {
+      const filePath = path.resolve(srcDir, filename);
+
+      if ((event === 'change' || event === 'rename') && exists(filePath)) {
+        console.log(chalk.green('->'), `${event}: ${filename}`);
+        rebuild(filePath);
+      } else {
+        const buildFile = path.resolve(srcDir, '..', 'build', filename);
+        try {
+          fs.unlinkSync(buildFile);
+          process.stdout.write(
+            `${chalk.red('  \u2022 ') +
+              path.relative(
+                path.resolve(srcDir, '..', '..'),
+                buildFile
+              )} (deleted)\n`
+          );
+        } catch (e) {
+          // omit
+        }
+      }
+    });
+  } catch (e) {
+    // doesn't exist
+  }
+});
+
+setInterval(() => {
+  const files = Array.from(filesToBuild.keys());
+  if (files.length) {
+    filesToBuild = new Map();
+    try {
+      execSync(`${BUILD_CMD} ${files.join(' ')}`, { stdio: [0, 1, 2] });
+    } catch (e) {
+      // omit
+    }
+  }
+}, 100);
+
+console.log(chalk.red('->'), chalk.cyan('Watching for changes...'));