feat(watcher): use @parcel/watcher to watch entire app directory

package.json

@@ -38,6 +38,7 @@
     "test": "pnpm lint && vitest run --coverage"
   },
   "dependencies": {
+    "@parcel/watcher": "^2.2.0",
     "citty": "^0.1.2",
     "clipboardy": "^3.0.0",
     "consola": "^3.2.3",

src/_utils.ts

@@ -84,16 +84,17 @@ export async function createImporter(input: string, _cwd?: string) {
     input = `./${input}`;
   }
 
-  const entry = _jitiRequire.resolve(resolve(cwd, input));
+  const entry = _jitiRequire.resolve(input);
 
   const _import = () => {
     const r = _jitiRequire(input);
     return Promise.resolve(r.default || r);
   };
 
   return {
+    cwd,
+    relative: (path: string) => relative(cwd, path),
     entry,
-    relativeEntry: relative(cwd, entry),
     import: _import,
   };
 }

src/watch.ts

@@ -1,6 +1,6 @@
 import type { RequestListener } from "node:http";
-import { watch } from "node:fs";
 import { consola } from "consola";
+import { dirname } from "pathe";
 import type { Listener, ListenOptions, WatchOptions } from "./types";
 import { listen } from "./listen";
 import { createImporter } from "./_utils";
@@ -21,20 +21,32 @@ export async function listenAndWatch(
 
   resolveHandle();
 
-  const watcher = await watch(importer.entry, () => {
-    logger.info(`\`${importer.relativeEntry}\` changed, Reloading...`);
+  // https://github.com/parcel-bundler/watcher
+  const { subscribe } = await import("@parcel/watcher").then(
+    (r) => r.default || r,
+  );
+
+  const entryDir = dirname(importer.entry);
+  const watcher = await subscribe(entryDir, (_error, events) => {
+    logger.log(
+      `🔃 ${events
+        .map((e) => `\`./${importer.relative(e.path)}\` ${e.type}d`)
+        .join(", ")}. Reloading server...`,
+    );
     resolveHandle();
   });
 
   const listenter = await listen((...args) => {
     return handle(...args);
   }, options);
 
-  logger.info(`Watching \`${importer.relativeEntry}\` for changes.`);
+  logger.log(`👀 Watching \`./${importer.relative(entryDir)}\` for changes.`);
 
   const _close = listenter.close;
   listenter.close = async () => {
-    watcher.close();
+    await watcher.unsubscribe().catch((error) => {
+      logger.error(error);
+    });
     await _close();
   };