@crxjs/vite-plugin 1.0.3 → 1.0.6

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @crxjs/vite-plugin
 
+## 1.0.6
+
+### Patch Changes
+
+- 63d102f: Automatically ignores `build.outDir` for server HMR, so the file
+  writer doesn't trigger a full reload.
+
+  Fixes flaky HMR updates for content scripts; Tailwind should work fine now 🥳
+
+- a1e2728: Fix isImporter recursion
+
+## 1.0.5
+
+### Patch Changes
+
+- 86adbec: Sometimes during development, an extension page may open before the
+  service worker has a chance to control fetch. The HTML file will load from the
+  file system, but the script tag might load from the dev server. This PR adds a
+  precontroller loader plugin to the dev server so that the extension page will
+  reload and the fetch handler will get the real HTML file from the server.
+
+## 1.0.4
+
+### Patch Changes
+
+- b83a4bd: Check for manifest assets first in the project root, then check in
+  the public dir. Throw an informative error if the file does not exist in
+  either dir.
+
 ## 1.0.3
 
 ### Patch Changes

package/dist/index.cjs

@@ -17,6 +17,7 @@ var vite = require('vite');
 var module$1 = require('module');
 var cheerio = require('cheerio');
 var jsesc = require('jsesc');
+var fs = require('fs');
 var injector = require('connect-injector');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -184,6 +185,7 @@ const setOutputMeta = ({
   outputByOwner.set(ownerName, output);
   outputById.set(id, output);
 };
+const transformResultByOwner = /* @__PURE__ */ new Map();
 
 const {
   basename,
@@ -230,17 +232,12 @@ function sourceToUrlMeta(source) {
 }
 const pluginFileWriterChunks = () => {
   let server;
-  const ownerToTransformResultMap = /* @__PURE__ */ new Map();
   return {
     name: "crx:file-writer-chunks",
     apply: "build",
     fileWriterStart(_server) {
       server = _server;
     },
-    watchChange(fileName) {
-      for (const owner of ownersByFile.get(fileName) ?? /* @__PURE__ */ new Set())
-        ownerToTransformResultMap.delete(owner);
-    },
     async resolveId(source, importer) {
       if (this.meta.watchMode) {
         if (idBySource.has(source)) {
@@ -276,12 +273,12 @@ const pluginFileWriterChunks = () => {
         if (!serverModule)
           throw new Error(`Unable to load "${url}" from server.`);
         const { file, url: owner } = serverModule;
-        transformResult = transformResult ?? ownerToTransformResultMap.get(owner) ?? serverModule.transformResult;
+        transformResult = transformResult ?? transformResultByOwner.get(owner) ?? serverModule.transformResult;
         if (!transformResult)
           transformResult = await server.transformRequest(url);
         if (!transformResult)
           throw new TypeError(`Unable to load "${url}" from server.`);
-        ownerToTransformResultMap.set(owner, transformResult);
+        transformResultByOwner.set(owner, transformResult);
         if (file) {
           setFileMeta({ id, file });
           this.addWatchFile(file);
@@ -368,7 +365,7 @@ const pluginFileWriterChunks = () => {
   };
 };
 
-/*! *****************************************************************************
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -1480,6 +1477,12 @@ function last(arr) {
 function popResultSelector(args) {
     return isFunction(last(args)) ? args.pop() : undefined;
 }
+function popScheduler(args) {
+    return isScheduler(last(args)) ? args.pop() : undefined;
+}
+function popNumber(args, defaultValue) {
+    return typeof last(args) === 'number' ? args.pop() : defaultValue;
+}
 
 var isArrayLike = (function (x) { return x && typeof x.length === 'number' && typeof x !== 'function'; });
 
@@ -1696,6 +1699,126 @@ function executeSchedule(parentSubscription, scheduler, work, delay, repeat) {
     }
 }
 
+function observeOn(scheduler, delay) {
+    if (delay === void 0) { delay = 0; }
+    return operate(function (source, subscriber) {
+        source.subscribe(createOperatorSubscriber(subscriber, function (value) { return executeSchedule(subscriber, scheduler, function () { return subscriber.next(value); }, delay); }, function () { return executeSchedule(subscriber, scheduler, function () { return subscriber.complete(); }, delay); }, function (err) { return executeSchedule(subscriber, scheduler, function () { return subscriber.error(err); }, delay); }));
+    });
+}
+
+function subscribeOn(scheduler, delay) {
+    if (delay === void 0) { delay = 0; }
+    return operate(function (source, subscriber) {
+        subscriber.add(scheduler.schedule(function () { return source.subscribe(subscriber); }, delay));
+    });
+}
+
+function scheduleObservable(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function schedulePromise(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function scheduleArray(input, scheduler) {
+    return new Observable(function (subscriber) {
+        var i = 0;
+        return scheduler.schedule(function () {
+            if (i === input.length) {
+                subscriber.complete();
+            }
+            else {
+                subscriber.next(input[i++]);
+                if (!subscriber.closed) {
+                    this.schedule();
+                }
+            }
+        });
+    });
+}
+
+function scheduleIterable(input, scheduler) {
+    return new Observable(function (subscriber) {
+        var iterator$1;
+        executeSchedule(subscriber, scheduler, function () {
+            iterator$1 = input[iterator]();
+            executeSchedule(subscriber, scheduler, function () {
+                var _a;
+                var value;
+                var done;
+                try {
+                    (_a = iterator$1.next(), value = _a.value, done = _a.done);
+                }
+                catch (err) {
+                    subscriber.error(err);
+                    return;
+                }
+                if (done) {
+                    subscriber.complete();
+                }
+                else {
+                    subscriber.next(value);
+                }
+            }, 0, true);
+        });
+        return function () { return isFunction(iterator$1 === null || iterator$1 === void 0 ? void 0 : iterator$1.return) && iterator$1.return(); };
+    });
+}
+
+function scheduleAsyncIterable(input, scheduler) {
+    if (!input) {
+        throw new Error('Iterable cannot be null');
+    }
+    return new Observable(function (subscriber) {
+        executeSchedule(subscriber, scheduler, function () {
+            var iterator = input[Symbol.asyncIterator]();
+            executeSchedule(subscriber, scheduler, function () {
+                iterator.next().then(function (result) {
+                    if (result.done) {
+                        subscriber.complete();
+                    }
+                    else {
+                        subscriber.next(result.value);
+                    }
+                });
+            }, 0, true);
+        });
+    });
+}
+
+function scheduleReadableStreamLike(input, scheduler) {
+    return scheduleAsyncIterable(readableStreamLikeToAsyncGenerator(input), scheduler);
+}
+
+function scheduled(input, scheduler) {
+    if (input != null) {
+        if (isInteropObservable(input)) {
+            return scheduleObservable(input, scheduler);
+        }
+        if (isArrayLike(input)) {
+            return scheduleArray(input, scheduler);
+        }
+        if (isPromise(input)) {
+            return schedulePromise(input, scheduler);
+        }
+        if (isAsyncIterable(input)) {
+            return scheduleAsyncIterable(input, scheduler);
+        }
+        if (isIterable(input)) {
+            return scheduleIterable(input, scheduler);
+        }
+        if (isReadableStreamLike(input)) {
+            return scheduleReadableStreamLike(input, scheduler);
+        }
+    }
+    throw createInvalidObservableTypeError(input);
+}
+
+function from(input, scheduler) {
+    return scheduler ? scheduled(input, scheduler) : innerFrom(input);
+}
+
 var EmptyError = createErrorClass(function (_super) { return function EmptyErrorImpl() {
     _super(this);
     this.name = 'EmptyError';
@@ -1806,6 +1929,11 @@ function mergeMap(project, resultSelector, concurrent) {
     return operate(function (source, subscriber) { return mergeInternals(source, subscriber, project, concurrent); });
 }
 
+function mergeAll(concurrent) {
+    if (concurrent === void 0) { concurrent = Infinity; }
+    return mergeMap(identity, concurrent);
+}
+
 function timer(dueTime, intervalOrScheduler, scheduler) {
     if (dueTime === void 0) { dueTime = 0; }
     if (scheduler === void 0) { scheduler = async; }
@@ -1838,13 +1966,22 @@ function timer(dueTime, intervalOrScheduler, scheduler) {
     });
 }
 
-function interval(period, scheduler) {
-    if (period === void 0) { period = 0; }
-    if (scheduler === void 0) { scheduler = asyncScheduler; }
-    if (period < 0) {
-        period = 0;
+function merge() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
     }
-    return timer(period, period, scheduler);
+    var scheduler = popScheduler(args);
+    var concurrent = popNumber(args, Infinity);
+    var sources = args;
+    return !sources.length
+        ?
+            EMPTY
+        : sources.length === 1
+            ?
+                innerFrom(sources[0])
+            :
+                mergeAll(concurrent)(from(sources, scheduler));
 }
 
 function filter(predicate, thisArg) {
@@ -1872,6 +2009,36 @@ function buffer(closingNotifier) {
     });
 }
 
+function debounce(durationSelector) {
+    return operate(function (source, subscriber) {
+        var hasValue = false;
+        var lastValue = null;
+        var durationSubscriber = null;
+        var emit = function () {
+            durationSubscriber === null || durationSubscriber === void 0 ? void 0 : durationSubscriber.unsubscribe();
+            durationSubscriber = null;
+            if (hasValue) {
+                hasValue = false;
+                var value = lastValue;
+                lastValue = null;
+                subscriber.next(value);
+            }
+        };
+        source.subscribe(createOperatorSubscriber(subscriber, function (value) {
+            durationSubscriber === null || durationSubscriber === void 0 ? void 0 : durationSubscriber.unsubscribe();
+            hasValue = true;
+            lastValue = value;
+            durationSubscriber = createOperatorSubscriber(subscriber, emit, noop);
+            innerFrom(durationSelector(value)).subscribe(durationSubscriber);
+        }, function () {
+            emit();
+            subscriber.complete();
+        }, undefined, function () {
+            lastValue = durationSubscriber = null;
+        }));
+    });
+}
+
 function defaultIfEmpty(defaultValue) {
     return operate(function (source, subscriber) {
         var hasValue = false;
@@ -1904,10 +2071,6 @@ function take(count) {
         });
 }
 
-function mapTo(value) {
-    return map(function () { return value; });
-}
-
 function throwIfEmpty(errorFactory) {
     if (errorFactory === void 0) { errorFactory = defaultErrorFactory; }
     return operate(function (source, subscriber) {
@@ -2002,7 +2165,7 @@ const filesStart$ = writerEvent$.pipe(filter((x) => {
 const filesStart = () => firstValueFrom(filesStart$);
 const filesReady$ = writerEvent$.pipe(filter((x) => {
   return x.type === "writeBundle";
-}), switchMap((event) => interval(100).pipe(mapTo(event), first(({ bundle, options, timestamp }) => {
+}), switchMap((event) => timer(0, 100).pipe(map(() => event), first(({ bundle, options, timestamp }) => {
   const result = Object.keys(bundle).every((p) => {
     const stats = statSync(join(options.dir, p));
     return stats.mtimeMs > timestamp;
@@ -2093,27 +2256,40 @@ const pluginFileWriterEvents = () => {
   };
 };
 
-var preControllerScript = "const id = setInterval(() => location.reload(), 100);\nsetTimeout(() => clearInterval(id), 5e3);\n";
+var precontrollerScript = "const id = setInterval(() => location.reload(), 100);\nsetTimeout(() => clearInterval(id), 5e3);\n";
 
-var preControllerHtml = "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <title>Waiting for the extension service worker...</title>\n    <script src=\"%PATH%\"></script>\n  </head>\n  <body>\n    <h1>Waiting for service worker</h1>\n\n    <p>\n      If you see this message, it means the service worker has not loaded fully.\n    </p>\n\n    <p>\n      During development, the service worker reroutes HTML requests to the dev\n      server, so this file isn't used unless the extension service worker opens\n      a page immediately after a full extension reload, and before the service\n      worker takes control of fetch (e.g., in the onInstalled event). In that\n      case, this page will continuously reload until the service worker is\n      ready, always less than 100 ms.\n    </p>\n\n    <p>This page is never added in production.</p>\n  </body>\n</html>\n";
+var precontrollerHtml = "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <title>Waiting for the extension service worker...</title>\n    <script src=\"%PATH%\"></script>\n  </head>\n  <body>\n    <h1>Waiting for service worker</h1>\n\n    <p>\n      If you see this message, it means the service worker has not loaded fully.\n    </p>\n\n    <p>This page is never added in production.</p>\n  </body>\n</html>\n";
 
 const pluginFileWriterHtml = () => {
+  let precontrollerName;
   return {
     name: "crx:file-writer-html",
     apply: "build",
+    fileWriterStart(server) {
+      const plugins = server.config.plugins;
+      const i = plugins.findIndex(({ name }) => name === "alias");
+      plugins.splice(i, 0, {
+        name: "crx:load-precontroller",
+        apply: "serve",
+        load(id) {
+          if (id === `/${precontrollerName}`)
+            return "location.reload();";
+        }
+      });
+    },
     renderCrxManifest(manifest) {
       if (this.meta.watchMode) {
         const refId = this.emitFile({
           type: "asset",
           name: "precontroller.js",
-          source: preControllerScript
+          source: precontrollerScript
         });
-        const name = this.getFileName(refId);
+        precontrollerName = this.getFileName(refId);
         for (const fileName of htmlFiles(manifest)) {
           this.emitFile({
             type: "asset",
             fileName,
-            source: preControllerHtml.replace("%PATH%", `/${name}`)
+            source: precontrollerHtml.replace("%PATH%", `/${precontrollerName}`)
           });
         }
       }
@@ -2138,7 +2314,6 @@ const pluginFileWriterPublic = () => {
           const source = await fsExtra.readFile(file);
           const fileName = relative(config.publicDir, file);
           this.emitFile({ type: "asset", fileName, source });
-          this.addWatchFile(file);
         }
       }
     }
@@ -2173,6 +2348,94 @@ const pluginFileWriterPolyfill = () => {
   };
 };
 
+function isUpdatePayload(p) {
+  return p.type === "update";
+}
+function isFullReloadPayload(p) {
+  return p.type === "full-reload";
+}
+function isPrunePayload(p) {
+  return p.type === "prune";
+}
+function isCrxHMRPayload(x) {
+  return x.type === "custom" && x.event.startsWith("crx:");
+}
+const hmrPayload$ = new Subject();
+const hmrPrune$ = hmrPayload$.pipe(filter(isPrunePayload));
+const hmrFullReload$ = hmrPayload$.pipe(filter(isFullReloadPayload));
+const hmrUpdate$ = hmrPayload$.pipe(filter(isUpdatePayload));
+const payload$ = merge(hmrFullReload$, hmrPrune$, hmrUpdate$);
+const rebuildSignal$ = payload$.pipe(buffer(payload$.pipe(debounce(() => filesReady$))), map((payloads) => {
+  if (payloads.every(isUpdatePayload)) {
+    const owners = /* @__PURE__ */ new Set();
+    for (const { updates } of payloads)
+      for (const { path } of updates)
+        if (transformResultByOwner.has(path))
+          owners.add(path);
+    return { type: "partial", owners };
+  }
+  return { type: "full" };
+}), filter((rebuild) => rebuild.type === "partial" ? rebuild.owners.size > 0 : true));
+const crxHmrPayload$ = hmrPayload$.pipe(filter((p) => !isCrxHMRPayload(p)), buffer(filesReady$), mergeMap((pps) => {
+  let fullReload;
+  const payloads = [];
+  for (const p of pps.slice(-50))
+    if (p.type === "full-reload") {
+      fullReload = p;
+    } else {
+      payloads.push(p);
+    }
+  if (fullReload)
+    payloads.push(fullReload);
+  return payloads;
+}), map((p) => {
+  switch (p.type) {
+    case "full-reload": {
+      const path = p.path && outputByOwner.get(p.path);
+      const fullReload = {
+        type: "full-reload",
+        path
+      };
+      return fullReload;
+    }
+    case "prune": {
+      const paths = [];
+      for (const owner of p.paths)
+        if (outputByOwner.has(owner))
+          paths.push(outputByOwner.get(owner));
+      return { type: "prune", paths };
+    }
+    case "update": {
+      const updates = [];
+      for (const { acceptedPath, path, ...rest } of p.updates)
+        if (outputByOwner.has(acceptedPath) && outputByOwner.has(path))
+          updates.push({
+            ...rest,
+            acceptedPath: outputByOwner.get(acceptedPath),
+            path: outputByOwner.get(path)
+          });
+      return { type: "update", updates };
+    }
+    default:
+      return p;
+  }
+}), withLatestFrom(filesReady$), filter(([p, { bundle }]) => {
+  switch (p.type) {
+    case "full-reload":
+      return typeof p.path === "undefined" || p.path in bundle;
+    case "prune":
+      return p.paths.length > 0;
+    case "update":
+      return p.updates.length > 0;
+    default:
+      return true;
+  }
+}), map(([p]) => ({
+  type: "custom",
+  event: "crx:content-script-payload",
+  data: p
+})));
+
 function sortPlugins(plugins, command) {
   const pre = [];
   const mid = [];
@@ -2269,6 +2532,18 @@ const pluginFileWriter = (crxPlugins) => (options) => {
             writerEvent$.next({ type: "error", error, code, frame });
           }
         });
+        const rebuildSub = rebuildSignal$.subscribe((rebuild) => {
+          if (rebuild.type === "partial") {
+            for (const owner of rebuild.owners)
+              transformResultByOwner.delete(owner);
+          } else {
+            transformResultByOwner.clear();
+          }
+          rebuildFiles();
+        });
+        watcher.on("close", () => {
+          rebuildSub.unsubscribe();
+        });
       });
     },
     closeBundle() {
@@ -2277,87 +2552,30 @@ const pluginFileWriter = (crxPlugins) => (options) => {
   };
 };
 
-const debug$2 = _debug("hmr");
 function isImporter(file) {
-  const pred = (node) => {
-    if (node.file === file)
+  const seen = /* @__PURE__ */ new Set();
+  const pred = (changedNode) => {
+    seen.add(changedNode);
+    if (changedNode.file === file)
       return true;
-    for (const node2 of node.importers)
-      if (pred(node2))
+    for (const parentNode of changedNode.importers) {
+      const unseen = !seen.has(parentNode);
+      if (unseen && pred(parentNode))
         return true;
+    }
+    return false;
   };
   return pred;
 }
-function isCrxHMRPayload(x) {
-  return x.type === "custom" && x.event.startsWith("crx:");
-}
-const hmrPayload$ = new Subject();
-const crxHmrPayload$ = hmrPayload$.pipe(filter((p) => !isCrxHMRPayload(p)), buffer(filesReady$), mergeMap((pps) => {
-  let fullReload;
-  const payloads = [];
-  for (const p of pps.slice(-50))
-    if (p.type === "full-reload") {
-      fullReload = p;
-    } else {
-      payloads.push(p);
-    }
-  if (fullReload)
-    payloads.push(fullReload);
-  return payloads;
-}), map((p) => {
-  switch (p.type) {
-    case "full-reload": {
-      const path = p.path && outputByOwner.get(p.path);
-      const fullReload = {
-        type: "full-reload",
-        path
-      };
-      return fullReload;
-    }
-    case "prune": {
-      const paths = [];
-      for (const owner of p.paths)
-        if (outputByOwner.has(owner))
-          paths.push(outputByOwner.get(owner));
-      return { type: "prune", paths };
-    }
-    case "update": {
-      const updates = [];
-      for (const { acceptedPath, path, ...rest } of p.updates)
-        if (outputByOwner.has(acceptedPath) && outputByOwner.has(path))
-          updates.push({
-            ...rest,
-            acceptedPath: outputByOwner.get(acceptedPath),
-            path: outputByOwner.get(path)
-          });
-      return { type: "update", updates };
-    }
-    default:
-      return p;
-  }
-}), withLatestFrom(filesReady$), filter(([p, { bundle }]) => {
-  switch (p.type) {
-    case "full-reload":
-      return typeof p.path === "undefined" || p.path in bundle;
-    case "prune":
-      return p.paths.length > 0;
-    case "update":
-      return p.updates.length > 0;
-    default:
-      return true;
-  }
-}), map(([p]) => ({
-  type: "custom",
-  event: "crx:content-script-payload",
-  data: p
-})));
+
+const debug$2 = _debug("hmr");
 const crxRuntimeReload = {
   type: "custom",
   event: "crx:runtime-reload"
 };
 const pluginHMR = () => {
   let files;
-  let server;
+  let decoratedSend;
   return [
     {
       name: "crx:hmr",
@@ -2374,38 +2592,41 @@ const pluginHMR = () => {
       name: "crx:hmr",
       apply: "serve",
       enforce: "pre",
-      config({ server: server2 = {}, ...config }) {
-        if (server2.hmr === false)
+      config({ server = {}, ...config }) {
+        if (server.hmr === false)
           return;
-        if (server2.hmr === true)
-          server2.hmr = {};
-        server2.hmr = server2.hmr ?? {};
-        server2.hmr.host = "localhost";
-        return { server: server2, ...config };
+        if (server.hmr === true)
+          server.hmr = {};
+        server.hmr = server.hmr ?? {};
+        server.hmr.host = "localhost";
+        return { server, ...config };
       },
       configResolved(config) {
         const { watch = {} } = config.server;
         config.server.watch = watch;
         watch.ignored = watch.ignored ? [...new Set([watch.ignored].flat())] : [];
-        watch.ignored.push(config.build.outDir);
+        const outDir = isAbsolute(config.build.outDir) ? config.build.outDir : join(config.root, config.build.outDir, "**/*");
+        watch.ignored.push(outDir);
       },
-      configureServer(_server) {
-        server = _server;
-        const { send } = server.ws;
-        server.ws.send = (payload) => {
-          hmrPayload$.next(payload);
-          send(payload);
-        };
-        crxHmrPayload$.subscribe((payload) => {
-          send(payload);
-        });
+      configureServer(server) {
+        if (server.ws.send !== decoratedSend) {
+          const { send } = server.ws;
+          decoratedSend = (payload) => {
+            hmrPayload$.next(payload);
+            send(payload);
+          };
+          server.ws.send = decoratedSend;
+          crxHmrPayload$.subscribe((payload) => {
+            send(payload);
+          });
+        }
       },
-      handleHotUpdate({ file, modules, server: server2 }) {
-        const background = files.background[0] && join(server2.config.root, files.background[0]);
+      handleHotUpdate({ file, modules, server }) {
+        const background = files.background[0] && join(server.config.root, files.background[0]);
         if (background) {
           if (file === background || modules.some(isImporter(background))) {
             debug$2("sending runtime reload");
-            server2.ws.send(crxRuntimeReload);
+            server.ws.send(crxRuntimeReload);
             return [];
           }
         }
@@ -2731,7 +2952,14 @@ const pluginManifest = (_manifest) => () => {
         const files = await manifestFiles(manifest2);
         await Promise.all(assetTypes.map((k) => files[k]).flat().map(async (f) => {
           if (typeof bundle[f] === "undefined") {
-            const filename = join(config.root, f);
+            let filename = join(config.root, f);
+            if (!fs.existsSync(filename))
+              filename = join(config.publicDir, f);
+            if (!fs.existsSync(filename))
+              throw new Error(`ENOENT: Could not load manifest asset "${f}".
+Manifest assets must exist in one of these directories:
+Project root: "${config.root}"
+Public dir: "${config.publicDir}"`);
             this.emitFile({
               type: "asset",
               fileName: f,

package/dist/index.mjs

@@ -13,6 +13,7 @@ import { createLogger } from 'vite';
 import { createRequire } from 'module';
 import { load } from 'cheerio';
 import jsesc from 'jsesc';
+import { existsSync } from 'fs';
 import injector from 'connect-injector';
 
 const _debug = (id) => debug$5("crx").extend(id);
@@ -151,6 +152,7 @@ const setOutputMeta = ({
   outputByOwner.set(ownerName, output);
   outputById.set(id, output);
 };
+const transformResultByOwner = /* @__PURE__ */ new Map();
 
 const {
   basename,
@@ -197,17 +199,12 @@ function sourceToUrlMeta(source) {
 }
 const pluginFileWriterChunks = () => {
   let server;
-  const ownerToTransformResultMap = /* @__PURE__ */ new Map();
   return {
     name: "crx:file-writer-chunks",
     apply: "build",
     fileWriterStart(_server) {
       server = _server;
     },
-    watchChange(fileName) {
-      for (const owner of ownersByFile.get(fileName) ?? /* @__PURE__ */ new Set())
-        ownerToTransformResultMap.delete(owner);
-    },
     async resolveId(source, importer) {
       if (this.meta.watchMode) {
         if (idBySource.has(source)) {
@@ -243,12 +240,12 @@ const pluginFileWriterChunks = () => {
         if (!serverModule)
           throw new Error(`Unable to load "${url}" from server.`);
         const { file, url: owner } = serverModule;
-        transformResult = transformResult ?? ownerToTransformResultMap.get(owner) ?? serverModule.transformResult;
+        transformResult = transformResult ?? transformResultByOwner.get(owner) ?? serverModule.transformResult;
         if (!transformResult)
           transformResult = await server.transformRequest(url);
         if (!transformResult)
           throw new TypeError(`Unable to load "${url}" from server.`);
-        ownerToTransformResultMap.set(owner, transformResult);
+        transformResultByOwner.set(owner, transformResult);
         if (file) {
           setFileMeta({ id, file });
           this.addWatchFile(file);
@@ -335,7 +332,7 @@ const pluginFileWriterChunks = () => {
   };
 };
 
-/*! *****************************************************************************
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -1447,6 +1444,12 @@ function last(arr) {
 function popResultSelector(args) {
     return isFunction(last(args)) ? args.pop() : undefined;
 }
+function popScheduler(args) {
+    return isScheduler(last(args)) ? args.pop() : undefined;
+}
+function popNumber(args, defaultValue) {
+    return typeof last(args) === 'number' ? args.pop() : defaultValue;
+}
 
 var isArrayLike = (function (x) { return x && typeof x.length === 'number' && typeof x !== 'function'; });
 
@@ -1663,6 +1666,126 @@ function executeSchedule(parentSubscription, scheduler, work, delay, repeat) {
     }
 }
 
+function observeOn(scheduler, delay) {
+    if (delay === void 0) { delay = 0; }
+    return operate(function (source, subscriber) {
+        source.subscribe(createOperatorSubscriber(subscriber, function (value) { return executeSchedule(subscriber, scheduler, function () { return subscriber.next(value); }, delay); }, function () { return executeSchedule(subscriber, scheduler, function () { return subscriber.complete(); }, delay); }, function (err) { return executeSchedule(subscriber, scheduler, function () { return subscriber.error(err); }, delay); }));
+    });
+}
+
+function subscribeOn(scheduler, delay) {
+    if (delay === void 0) { delay = 0; }
+    return operate(function (source, subscriber) {
+        subscriber.add(scheduler.schedule(function () { return source.subscribe(subscriber); }, delay));
+    });
+}
+
+function scheduleObservable(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function schedulePromise(input, scheduler) {
+    return innerFrom(input).pipe(subscribeOn(scheduler), observeOn(scheduler));
+}
+
+function scheduleArray(input, scheduler) {
+    return new Observable(function (subscriber) {
+        var i = 0;
+        return scheduler.schedule(function () {
+            if (i === input.length) {
+                subscriber.complete();
+            }
+            else {
+                subscriber.next(input[i++]);
+                if (!subscriber.closed) {
+                    this.schedule();
+                }
+            }
+        });
+    });
+}
+
+function scheduleIterable(input, scheduler) {
+    return new Observable(function (subscriber) {
+        var iterator$1;
+        executeSchedule(subscriber, scheduler, function () {
+            iterator$1 = input[iterator]();
+            executeSchedule(subscriber, scheduler, function () {
+                var _a;
+                var value;
+                var done;
+                try {
+                    (_a = iterator$1.next(), value = _a.value, done = _a.done);
+                }
+                catch (err) {
+                    subscriber.error(err);
+                    return;
+                }
+                if (done) {
+                    subscriber.complete();
+                }
+                else {
+                    subscriber.next(value);
+                }
+            }, 0, true);
+        });
+        return function () { return isFunction(iterator$1 === null || iterator$1 === void 0 ? void 0 : iterator$1.return) && iterator$1.return(); };
+    });
+}
+
+function scheduleAsyncIterable(input, scheduler) {
+    if (!input) {
+        throw new Error('Iterable cannot be null');
+    }
+    return new Observable(function (subscriber) {
+        executeSchedule(subscriber, scheduler, function () {
+            var iterator = input[Symbol.asyncIterator]();
+            executeSchedule(subscriber, scheduler, function () {
+                iterator.next().then(function (result) {
+                    if (result.done) {
+                        subscriber.complete();
+                    }
+                    else {
+                        subscriber.next(result.value);
+                    }
+                });
+            }, 0, true);
+        });
+    });
+}
+
+function scheduleReadableStreamLike(input, scheduler) {
+    return scheduleAsyncIterable(readableStreamLikeToAsyncGenerator(input), scheduler);
+}
+
+function scheduled(input, scheduler) {
+    if (input != null) {
+        if (isInteropObservable(input)) {
+            return scheduleObservable(input, scheduler);
+        }
+        if (isArrayLike(input)) {
+            return scheduleArray(input, scheduler);
+        }
+        if (isPromise(input)) {
+            return schedulePromise(input, scheduler);
+        }
+        if (isAsyncIterable(input)) {
+            return scheduleAsyncIterable(input, scheduler);
+        }
+        if (isIterable(input)) {
+            return scheduleIterable(input, scheduler);
+        }
+        if (isReadableStreamLike(input)) {
+            return scheduleReadableStreamLike(input, scheduler);
+        }
+    }
+    throw createInvalidObservableTypeError(input);
+}
+
+function from(input, scheduler) {
+    return scheduler ? scheduled(input, scheduler) : innerFrom(input);
+}
+
 var EmptyError = createErrorClass(function (_super) { return function EmptyErrorImpl() {
     _super(this);
     this.name = 'EmptyError';
@@ -1773,6 +1896,11 @@ function mergeMap(project, resultSelector, concurrent) {
     return operate(function (source, subscriber) { return mergeInternals(source, subscriber, project, concurrent); });
 }
 
+function mergeAll(concurrent) {
+    if (concurrent === void 0) { concurrent = Infinity; }
+    return mergeMap(identity, concurrent);
+}
+
 function timer(dueTime, intervalOrScheduler, scheduler) {
     if (dueTime === void 0) { dueTime = 0; }
     if (scheduler === void 0) { scheduler = async; }
@@ -1805,13 +1933,22 @@ function timer(dueTime, intervalOrScheduler, scheduler) {
     });
 }
 
-function interval(period, scheduler) {
-    if (period === void 0) { period = 0; }
-    if (scheduler === void 0) { scheduler = asyncScheduler; }
-    if (period < 0) {
-        period = 0;
+function merge() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
     }
-    return timer(period, period, scheduler);
+    var scheduler = popScheduler(args);
+    var concurrent = popNumber(args, Infinity);
+    var sources = args;
+    return !sources.length
+        ?
+            EMPTY
+        : sources.length === 1
+            ?
+                innerFrom(sources[0])
+            :
+                mergeAll(concurrent)(from(sources, scheduler));
 }
 
 function filter(predicate, thisArg) {
@@ -1839,6 +1976,36 @@ function buffer(closingNotifier) {
     });
 }
 
+function debounce(durationSelector) {
+    return operate(function (source, subscriber) {
+        var hasValue = false;
+        var lastValue = null;
+        var durationSubscriber = null;
+        var emit = function () {
+            durationSubscriber === null || durationSubscriber === void 0 ? void 0 : durationSubscriber.unsubscribe();
+            durationSubscriber = null;
+            if (hasValue) {
+                hasValue = false;
+                var value = lastValue;
+                lastValue = null;
+                subscriber.next(value);
+            }
+        };
+        source.subscribe(createOperatorSubscriber(subscriber, function (value) {
+            durationSubscriber === null || durationSubscriber === void 0 ? void 0 : durationSubscriber.unsubscribe();
+            hasValue = true;
+            lastValue = value;
+            durationSubscriber = createOperatorSubscriber(subscriber, emit, noop);
+            innerFrom(durationSelector(value)).subscribe(durationSubscriber);
+        }, function () {
+            emit();
+            subscriber.complete();
+        }, undefined, function () {
+            lastValue = durationSubscriber = null;
+        }));
+    });
+}
+
 function defaultIfEmpty(defaultValue) {
     return operate(function (source, subscriber) {
         var hasValue = false;
@@ -1871,10 +2038,6 @@ function take(count) {
         });
 }
 
-function mapTo(value) {
-    return map(function () { return value; });
-}
-
 function throwIfEmpty(errorFactory) {
     if (errorFactory === void 0) { errorFactory = defaultErrorFactory; }
     return operate(function (source, subscriber) {
@@ -1969,7 +2132,7 @@ const filesStart$ = writerEvent$.pipe(filter((x) => {
 const filesStart = () => firstValueFrom(filesStart$);
 const filesReady$ = writerEvent$.pipe(filter((x) => {
   return x.type === "writeBundle";
-}), switchMap((event) => interval(100).pipe(mapTo(event), first(({ bundle, options, timestamp }) => {
+}), switchMap((event) => timer(0, 100).pipe(map(() => event), first(({ bundle, options, timestamp }) => {
   const result = Object.keys(bundle).every((p) => {
     const stats = statSync(join(options.dir, p));
     return stats.mtimeMs > timestamp;
@@ -2060,27 +2223,40 @@ const pluginFileWriterEvents = () => {
   };
 };
 
-var preControllerScript = "const id = setInterval(() => location.reload(), 100);\nsetTimeout(() => clearInterval(id), 5e3);\n";
+var precontrollerScript = "const id = setInterval(() => location.reload(), 100);\nsetTimeout(() => clearInterval(id), 5e3);\n";
 
-var preControllerHtml = "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <title>Waiting for the extension service worker...</title>\n    <script src=\"%PATH%\"></script>\n  </head>\n  <body>\n    <h1>Waiting for service worker</h1>\n\n    <p>\n      If you see this message, it means the service worker has not loaded fully.\n    </p>\n\n    <p>\n      During development, the service worker reroutes HTML requests to the dev\n      server, so this file isn't used unless the extension service worker opens\n      a page immediately after a full extension reload, and before the service\n      worker takes control of fetch (e.g., in the onInstalled event). In that\n      case, this page will continuously reload until the service worker is\n      ready, always less than 100 ms.\n    </p>\n\n    <p>This page is never added in production.</p>\n  </body>\n</html>\n";
+var precontrollerHtml = "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <title>Waiting for the extension service worker...</title>\n    <script src=\"%PATH%\"></script>\n  </head>\n  <body>\n    <h1>Waiting for service worker</h1>\n\n    <p>\n      If you see this message, it means the service worker has not loaded fully.\n    </p>\n\n    <p>This page is never added in production.</p>\n  </body>\n</html>\n";
 
 const pluginFileWriterHtml = () => {
+  let precontrollerName;
   return {
     name: "crx:file-writer-html",
     apply: "build",
+    fileWriterStart(server) {
+      const plugins = server.config.plugins;
+      const i = plugins.findIndex(({ name }) => name === "alias");
+      plugins.splice(i, 0, {
+        name: "crx:load-precontroller",
+        apply: "serve",
+        load(id) {
+          if (id === `/${precontrollerName}`)
+            return "location.reload();";
+        }
+      });
+    },
     renderCrxManifest(manifest) {
       if (this.meta.watchMode) {
         const refId = this.emitFile({
           type: "asset",
           name: "precontroller.js",
-          source: preControllerScript
+          source: precontrollerScript
         });
-        const name = this.getFileName(refId);
+        precontrollerName = this.getFileName(refId);
         for (const fileName of htmlFiles(manifest)) {
           this.emitFile({
             type: "asset",
             fileName,
-            source: preControllerHtml.replace("%PATH%", `/${name}`)
+            source: precontrollerHtml.replace("%PATH%", `/${precontrollerName}`)
           });
         }
       }
@@ -2105,7 +2281,6 @@ const pluginFileWriterPublic = () => {
           const source = await readFile(file);
           const fileName = relative(config.publicDir, file);
           this.emitFile({ type: "asset", fileName, source });
-          this.addWatchFile(file);
         }
       }
     }
@@ -2140,6 +2315,94 @@ const pluginFileWriterPolyfill = () => {
   };
 };
 
+function isUpdatePayload(p) {
+  return p.type === "update";
+}
+function isFullReloadPayload(p) {
+  return p.type === "full-reload";
+}
+function isPrunePayload(p) {
+  return p.type === "prune";
+}
+function isCrxHMRPayload(x) {
+  return x.type === "custom" && x.event.startsWith("crx:");
+}
+const hmrPayload$ = new Subject();
+const hmrPrune$ = hmrPayload$.pipe(filter(isPrunePayload));
+const hmrFullReload$ = hmrPayload$.pipe(filter(isFullReloadPayload));
+const hmrUpdate$ = hmrPayload$.pipe(filter(isUpdatePayload));
+const payload$ = merge(hmrFullReload$, hmrPrune$, hmrUpdate$);
+const rebuildSignal$ = payload$.pipe(buffer(payload$.pipe(debounce(() => filesReady$))), map((payloads) => {
+  if (payloads.every(isUpdatePayload)) {
+    const owners = /* @__PURE__ */ new Set();
+    for (const { updates } of payloads)
+      for (const { path } of updates)
+        if (transformResultByOwner.has(path))
+          owners.add(path);
+    return { type: "partial", owners };
+  }
+  return { type: "full" };
+}), filter((rebuild) => rebuild.type === "partial" ? rebuild.owners.size > 0 : true));
+const crxHmrPayload$ = hmrPayload$.pipe(filter((p) => !isCrxHMRPayload(p)), buffer(filesReady$), mergeMap((pps) => {
+  let fullReload;
+  const payloads = [];
+  for (const p of pps.slice(-50))
+    if (p.type === "full-reload") {
+      fullReload = p;
+    } else {
+      payloads.push(p);
+    }
+  if (fullReload)
+    payloads.push(fullReload);
+  return payloads;
+}), map((p) => {
+  switch (p.type) {
+    case "full-reload": {
+      const path = p.path && outputByOwner.get(p.path);
+      const fullReload = {
+        type: "full-reload",
+        path
+      };
+      return fullReload;
+    }
+    case "prune": {
+      const paths = [];
+      for (const owner of p.paths)
+        if (outputByOwner.has(owner))
+          paths.push(outputByOwner.get(owner));
+      return { type: "prune", paths };
+    }
+    case "update": {
+      const updates = [];
+      for (const { acceptedPath, path, ...rest } of p.updates)
+        if (outputByOwner.has(acceptedPath) && outputByOwner.has(path))
+          updates.push({
+            ...rest,
+            acceptedPath: outputByOwner.get(acceptedPath),
+            path: outputByOwner.get(path)
+          });
+      return { type: "update", updates };
+    }
+    default:
+      return p;
+  }
+}), withLatestFrom(filesReady$), filter(([p, { bundle }]) => {
+  switch (p.type) {
+    case "full-reload":
+      return typeof p.path === "undefined" || p.path in bundle;
+    case "prune":
+      return p.paths.length > 0;
+    case "update":
+      return p.updates.length > 0;
+    default:
+      return true;
+  }
+}), map(([p]) => ({
+  type: "custom",
+  event: "crx:content-script-payload",
+  data: p
+})));
+
 function sortPlugins(plugins, command) {
   const pre = [];
   const mid = [];
@@ -2236,6 +2499,18 @@ const pluginFileWriter = (crxPlugins) => (options) => {
             writerEvent$.next({ type: "error", error, code, frame });
           }
         });
+        const rebuildSub = rebuildSignal$.subscribe((rebuild) => {
+          if (rebuild.type === "partial") {
+            for (const owner of rebuild.owners)
+              transformResultByOwner.delete(owner);
+          } else {
+            transformResultByOwner.clear();
+          }
+          rebuildFiles();
+        });
+        watcher.on("close", () => {
+          rebuildSub.unsubscribe();
+        });
       });
     },
     closeBundle() {
@@ -2244,87 +2519,30 @@ const pluginFileWriter = (crxPlugins) => (options) => {
   };
 };
 
-const debug$2 = _debug("hmr");
 function isImporter(file) {
-  const pred = (node) => {
-    if (node.file === file)
+  const seen = /* @__PURE__ */ new Set();
+  const pred = (changedNode) => {
+    seen.add(changedNode);
+    if (changedNode.file === file)
       return true;
-    for (const node2 of node.importers)
-      if (pred(node2))
+    for (const parentNode of changedNode.importers) {
+      const unseen = !seen.has(parentNode);
+      if (unseen && pred(parentNode))
         return true;
+    }
+    return false;
   };
   return pred;
 }
-function isCrxHMRPayload(x) {
-  return x.type === "custom" && x.event.startsWith("crx:");
-}
-const hmrPayload$ = new Subject();
-const crxHmrPayload$ = hmrPayload$.pipe(filter((p) => !isCrxHMRPayload(p)), buffer(filesReady$), mergeMap((pps) => {
-  let fullReload;
-  const payloads = [];
-  for (const p of pps.slice(-50))
-    if (p.type === "full-reload") {
-      fullReload = p;
-    } else {
-      payloads.push(p);
-    }
-  if (fullReload)
-    payloads.push(fullReload);
-  return payloads;
-}), map((p) => {
-  switch (p.type) {
-    case "full-reload": {
-      const path = p.path && outputByOwner.get(p.path);
-      const fullReload = {
-        type: "full-reload",
-        path
-      };
-      return fullReload;
-    }
-    case "prune": {
-      const paths = [];
-      for (const owner of p.paths)
-        if (outputByOwner.has(owner))
-          paths.push(outputByOwner.get(owner));
-      return { type: "prune", paths };
-    }
-    case "update": {
-      const updates = [];
-      for (const { acceptedPath, path, ...rest } of p.updates)
-        if (outputByOwner.has(acceptedPath) && outputByOwner.has(path))
-          updates.push({
-            ...rest,
-            acceptedPath: outputByOwner.get(acceptedPath),
-            path: outputByOwner.get(path)
-          });
-      return { type: "update", updates };
-    }
-    default:
-      return p;
-  }
-}), withLatestFrom(filesReady$), filter(([p, { bundle }]) => {
-  switch (p.type) {
-    case "full-reload":
-      return typeof p.path === "undefined" || p.path in bundle;
-    case "prune":
-      return p.paths.length > 0;
-    case "update":
-      return p.updates.length > 0;
-    default:
-      return true;
-  }
-}), map(([p]) => ({
-  type: "custom",
-  event: "crx:content-script-payload",
-  data: p
-})));
+
+const debug$2 = _debug("hmr");
 const crxRuntimeReload = {
   type: "custom",
   event: "crx:runtime-reload"
 };
 const pluginHMR = () => {
   let files;
-  let server;
+  let decoratedSend;
   return [
     {
       name: "crx:hmr",
@@ -2341,38 +2559,41 @@ const pluginHMR = () => {
       name: "crx:hmr",
       apply: "serve",
       enforce: "pre",
-      config({ server: server2 = {}, ...config }) {
-        if (server2.hmr === false)
+      config({ server = {}, ...config }) {
+        if (server.hmr === false)
           return;
-        if (server2.hmr === true)
-          server2.hmr = {};
-        server2.hmr = server2.hmr ?? {};
-        server2.hmr.host = "localhost";
-        return { server: server2, ...config };
+        if (server.hmr === true)
+          server.hmr = {};
+        server.hmr = server.hmr ?? {};
+        server.hmr.host = "localhost";
+        return { server, ...config };
       },
       configResolved(config) {
         const { watch = {} } = config.server;
         config.server.watch = watch;
         watch.ignored = watch.ignored ? [...new Set([watch.ignored].flat())] : [];
-        watch.ignored.push(config.build.outDir);
+        const outDir = isAbsolute(config.build.outDir) ? config.build.outDir : join(config.root, config.build.outDir, "**/*");
+        watch.ignored.push(outDir);
       },
-      configureServer(_server) {
-        server = _server;
-        const { send } = server.ws;
-        server.ws.send = (payload) => {
-          hmrPayload$.next(payload);
-          send(payload);
-        };
-        crxHmrPayload$.subscribe((payload) => {
-          send(payload);
-        });
+      configureServer(server) {
+        if (server.ws.send !== decoratedSend) {
+          const { send } = server.ws;
+          decoratedSend = (payload) => {
+            hmrPayload$.next(payload);
+            send(payload);
+          };
+          server.ws.send = decoratedSend;
+          crxHmrPayload$.subscribe((payload) => {
+            send(payload);
+          });
+        }
       },
-      handleHotUpdate({ file, modules, server: server2 }) {
-        const background = files.background[0] && join(server2.config.root, files.background[0]);
+      handleHotUpdate({ file, modules, server }) {
+        const background = files.background[0] && join(server.config.root, files.background[0]);
         if (background) {
           if (file === background || modules.some(isImporter(background))) {
             debug$2("sending runtime reload");
-            server2.ws.send(crxRuntimeReload);
+            server.ws.send(crxRuntimeReload);
             return [];
           }
         }
@@ -2698,7 +2919,14 @@ const pluginManifest = (_manifest) => () => {
         const files = await manifestFiles(manifest2);
         await Promise.all(assetTypes.map((k) => files[k]).flat().map(async (f) => {
           if (typeof bundle[f] === "undefined") {
-            const filename = join(config.root, f);
+            let filename = join(config.root, f);
+            if (!existsSync(filename))
+              filename = join(config.publicDir, f);
+            if (!existsSync(filename))
+              throw new Error(`ENOENT: Could not load manifest asset "${f}".
+Manifest assets must exist in one of these directories:
+Project root: "${config.root}"
+Public dir: "${config.publicDir}"`);
             this.emitFile({
               type: "asset",
               fileName: f,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crxjs/vite-plugin",
-  "version": "1.0.3",
+  "version": "1.0.6",
   "description": "Build Chrome Extensions with this Vite plugin.",
   "keywords": [
     "rollup-plugin",
@@ -50,12 +50,13 @@
     "lint": "run-s lint:eslint lint:types",
     "lint:eslint": "eslint \"{src,test}/**/*.ts\"",
     "lint:types": "tsc --noEmit",
-    "test": "run-s test:update:*",
+    "test": "run-s test:units test:update:*",
     "test:ci:e2e:build": "node --expose-gc ./node_modules/jest/bin/jest.js --logHeapUsage --runInBand --forceExit --testPathIgnorePatterns=\\(/node_modules/ /templates/ /mv3/\\) -t build",
     "test:ci:e2e:serve": "npm run test:ci:e2e:serve:cmd || npm run test:ci:e2e:serve:cmd",
     "test:ci:e2e:serve:cmd": "node --expose-gc ./node_modules/jest/bin/jest.js --logHeapUsage --runInBand --forceExit --testPathIgnorePatterns=\\(/node_modules/ /templates/ /mv3/\\) -t serve",
     "test:ci:mv3:build": "node --expose-gc ./node_modules/jest/bin/jest.js --logHeapUsage --runInBand --forceExit --testPathIgnorePatterns=\\(/node_modules/ /templates/ /e2e/\\) --updateSnapshot build",
     "test:ci:mv3:serve": "node --expose-gc ./node_modules/jest/bin/jest.js --logHeapUsage --runInBand --forceExit --testPathIgnorePatterns=\\(/node_modules/ /templates/ /e2e/\\) --updateSnapshot serve",
+    "test:units": "jest src",
     "test:update:build": "jest build -u",
     "test:update:serve": "jest serve -u"
   },
@@ -82,22 +83,22 @@
     "@rollup/plugin-commonjs": "21.1.0",
     "@rollup/plugin-node-resolve": "13.2.0",
     "@types/acorn": "4.0.6",
-    "@types/chrome": "0.0.183",
+    "@types/chrome": "0.0.184",
     "@types/debug": "4.1.7",
     "@types/fs-extra": "9.0.13",
-    "@types/jest": "27.4.1",
+    "@types/jest": "27.5.0",
     "@types/jest-image-snapshot": "4.3.1",
     "@types/jsesc": "3.0.1",
     "@types/node": "17.0.18",
     "@types/react": "17.0.44",
     "@types/react-dom": "17.0.16",
-    "@typescript-eslint/eslint-plugin": "5.21.0",
-    "@typescript-eslint/parser": "5.21.0",
-    "@vitejs/plugin-react": "1.3.1",
-    "@vitejs/plugin-vue": "2.3.1",
+    "@typescript-eslint/eslint-plugin": "5.23.0",
+    "@typescript-eslint/parser": "5.23.0",
+    "@vitejs/plugin-react": "1.3.2",
+    "@vitejs/plugin-vue": "2.3.2",
     "esbuild": "0.14.38",
     "esbuild-runner": "2.2.1",
-    "eslint": "^8.14.0",
+    "eslint": "8.15.0",
     "jest": "27.5.1",
     "jest-image-snapshot": "4.5.1",
     "playwright-chromium": "1.21.1",
@@ -107,6 +108,7 @@
     "rollup-plugin-dts": "^4.2.0",
     "rollup-plugin-esbuild": "4.9.1",
     "rxjs": "7.5.5",
+    "typescript": "^4.6.4",
     "vite": "^2.9.5",
     "vite-plugin-inspect": "0.5.0",
     "vue": "3.2.33"