@sveltejs/vite-plugin-svelte 2.1.1 → 2.3.0

package/dist/index.d.ts

@@ -3,6 +3,7 @@ import { CompileOptions, Warning } from 'svelte/types/compiler/interfaces';
 export { CompileOptions, Warning } from 'svelte/types/compiler/interfaces';
 import { PreprocessorGroup } from 'svelte/types/compiler/preprocess';
 export { MarkupPreprocessor, Preprocessor, PreprocessorGroup, Processed } from 'svelte/types/compiler/preprocess';
+import { Options as Options$1 } from '@sveltejs/vite-plugin-svelte-inspector';
 
 type Options = Omit<SvelteOptions, 'vitePlugin'> & PluginOptionsInline;
 interface PluginOptionsInline extends PluginOptions {
@@ -85,6 +86,12 @@ interface PluginOptions {
      * @default true for dev, false for build
      */
     prebundleSvelteLibraries?: boolean;
+    /**
+     * toggle/configure Svelte Inspector
+     *
+     * @default true
+     */
+    inspector?: Options$1 | boolean;
     /**
      * These options are considered experimental and breaking changes to them can occur in any release
      */
@@ -148,10 +155,6 @@ interface ExperimentalOptions {
         code: string;
         compileOptions: Partial<CompileOptions>;
     }) => Promise<Partial<CompileOptions> | void> | Partial<CompileOptions> | void;
-    /**
-     * enable svelte inspector
-     */
-    inspector?: InspectorOptions | boolean;
     /**
      * send a websocket message with svelte compiler warnings during dev
      *
@@ -164,74 +167,6 @@ interface ExperimentalOptions {
      */
     disableSvelteResolveWarnings?: boolean;
 }
-interface InspectorOptions {
-    /**
-     * define a key combo to toggle inspector,
-     * @default 'control-shift' on windows, 'meta-shift' on other os
-     *
-     * any number of modifiers `control` `shift` `alt` `meta` followed by zero or one regular key, separated by -
-     * examples: control-shift, control-o, control-alt-s  meta-x control-meta
-     * Some keys have native behavior (e.g. alt-s opens history menu on firefox).
-     * To avoid conflicts or accidentally typing into inputs, modifier only combinations are recommended.
-     */
-    toggleKeyCombo?: string;
-    /**
-     * define keys to select elements with via keyboard
-     * @default {parent: 'ArrowUp', child: 'ArrowDown', next: 'ArrowRight', prev: 'ArrowLeft' }
-     *
-     * improves accessibility and also helps when you want to select elements that do not have a hoverable surface area
-     * due to tight wrapping
-     *
-     * A note for users of screen-readers:
-     * If you are using arrow keys to navigate the page itself, change the navKeys to avoid conflicts.
-     * e.g. navKeys: {parent: 'w', prev: 'a', child: 's', next: 'd'}
-     *
-     *
-     * parent: select closest parent
-     * child: select first child (or grandchild)
-     * next: next sibling (or parent if no next sibling exists)
-     * prev: previous sibling (or parent if no prev sibling exists)
-     */
-    navKeys?: {
-        parent: string;
-        child: string;
-        next: string;
-        prev: string;
-    };
-    /**
-     * define key to open the editor for the currently selected dom node
-     *
-     * @default 'Enter'
-     */
-    openKey?: string;
-    /**
-     * inspector is automatically disabled when releasing toggleKeyCombo after holding it for a longpress
-     * @default false
-     */
-    holdMode?: boolean;
-    /**
-     * when to show the toggle button
-     * @default 'active'
-     */
-    showToggleButton?: 'always' | 'active' | 'never';
-    /**
-     * where to display the toggle button
-     * @default top-right
-     */
-    toggleButtonPos?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
-    /**
-     * inject custom styles when inspector is active
-     */
-    customStyles?: boolean;
-    /**
-     * append an import to the module id ending with `appendTo` instead of adding a script into body
-     * useful for frameworks that do not support trannsformIndexHtml hook
-     *
-     * WARNING: only set this if you know exactly what it does.
-     * Regular users of vite-plugin-svelte or SvelteKit do not need it
-     */
-    appendTo?: string;
-}
 type ModuleFormat = NonNullable<CompileOptions['format']>;
 type CssHashGetter = NonNullable<CompileOptions['cssHash']>;
 type Arrayable<T> = T | T[];

package/dist/index.js

@@ -7,11 +7,12 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // src/index.ts
-import fs8 from "fs";
+import fs7 from "fs";
 import { VERSION as svelteVersion } from "svelte/compiler";
 import {
   version as viteVersion
 } from "vite";
+import { svelteInspector } from "@sveltejs/vite-plugin-svelte-inspector";
 import { isDepExcluded as isDepExcluded2 } from "vitefu";
 
 // src/utils/log.ts
@@ -599,7 +600,6 @@ import ${JSON.stringify(cssId)};
         });
       }
     }
-    compiled.js.dependencies = dependencies;
     return {
       filename,
       normalizedFilename,
@@ -1169,16 +1169,11 @@ var allowedPluginOptions = /* @__PURE__ */ new Set([
   "ignorePluginPreprocessors",
   "disableDependencyReinclusion",
   "prebundleSvelteLibraries",
+  "inspector",
   "experimental"
 ]);
 var knownRootOptions = /* @__PURE__ */ new Set(["extensions", "compilerOptions", "preprocess", "onwarn"]);
-var allowedInlineOptions = /* @__PURE__ */ new Set([
-  "configFile",
-  "kit",
-  // only for internal use by sveltekit
-  ...allowedPluginOptions,
-  ...knownRootOptions
-]);
+var allowedInlineOptions = /* @__PURE__ */ new Set(["configFile", ...allowedPluginOptions, ...knownRootOptions]);
 function validateInlineOptions(inlineOptions) {
   const invalidKeys = Object.keys(inlineOptions || {}).filter(
     (key) => !allowedInlineOptions.has(key)
@@ -1300,7 +1295,6 @@ function resolveOptions(preResolveOptions2, viteConfig, cache) {
   const merged = mergeConfigs(defaultOptions, preResolveOptions2, extraOptions);
   removeIgnoredOptions(merged);
   handleDeprecatedOptions(merged);
-  addSvelteKitOptions(merged);
   addExtraPreprocessors(merged, viteConfig);
   enforceOptionsForHmr(merged);
   enforceOptionsForProduction(merged);
@@ -1382,21 +1376,21 @@ function removeIgnoredOptions(options) {
     });
   }
 }
-function addSvelteKitOptions(options) {
-  if (options?.kit != null && options.compilerOptions.hydratable == null) {
-    log.debug(`Setting compilerOptions.hydratable = true for SvelteKit`);
-    options.compilerOptions.hydratable = true;
-  }
-}
 function handleDeprecatedOptions(options) {
-  if (options.experimental?.prebundleSvelteLibraries) {
-    options.prebundleSvelteLibraries = options.experimental?.prebundleSvelteLibraries;
-    log.warn(
-      "experimental.prebundleSvelteLibraries is no longer experimental and has moved to prebundleSvelteLibraries"
-    );
-  }
-  if (options.experimental?.generateMissingPreprocessorSourcemaps) {
-    log.warn("experimental.generateMissingPreprocessorSourcemaps has been removed.");
+  const experimental = options.experimental;
+  if (experimental) {
+    for (const promoted of ["prebundleSvelteLibraries", "inspector"]) {
+      if (experimental[promoted]) {
+        options[promoted] = experimental[promoted];
+        delete experimental[promoted];
+        log.warn(
+          `Option "vitePlugin.experimental.${promoted}" is no longer experimental and has moved to "vitePlugin.${promoted}". Please update your svelte config.`
+        );
+      }
+    }
+    if (experimental.generateMissingPreprocessorSourcemaps) {
+      log.warn("experimental.generateMissingPreprocessorSourcemaps has been removed.");
+    }
   }
 }
 function resolveViteRoot(viteConfig) {
@@ -1745,129 +1739,11 @@ function generateSvelteMetadata(options) {
   return metadata;
 }
 
-// src/ui/inspector/plugin.ts
-import { normalizePath as normalizePath5 } from "vite";
-import path9 from "path";
-import { fileURLToPath } from "url";
-import fs6 from "fs";
-
-// src/ui/inspector/utils.ts
-var FS_PREFIX = `/@fs/`;
-var IS_WINDOWS3 = process.platform === "win32";
-var queryRE = /\?.*$/s;
-var hashRE = /#.*$/s;
-function idToFile(id) {
-  if (id.startsWith(FS_PREFIX)) {
-    id = id = id.slice(IS_WINDOWS3 ? FS_PREFIX.length : FS_PREFIX.length - 1);
-  }
-  return id.replace(hashRE, "").replace(queryRE, "");
-}
-
-// src/ui/inspector/plugin.ts
-var defaultInspectorOptions = {
-  toggleKeyCombo: process.platform === "win32" ? "control-shift" : "meta-shift",
-  navKeys: { parent: "ArrowUp", child: "ArrowDown", next: "ArrowRight", prev: "ArrowLeft" },
-  openKey: "Enter",
-  holdMode: false,
-  showToggleButton: "active",
-  toggleButtonPos: "top-right",
-  customStyles: true
-};
-function getInspectorPath() {
-  const pluginPath = normalizePath5(path9.dirname(fileURLToPath(import.meta.url)));
-  return pluginPath.replace(/\/vite-plugin-svelte\/dist$/, "/vite-plugin-svelte/src/ui/inspector/");
-}
-function svelteInspector() {
-  const inspectorPath = getInspectorPath();
-  log.debug.enabled && log.debug(`svelte inspector path: ${inspectorPath}`);
-  let inspectorOptions;
-  let appendTo;
-  let disabled = false;
-  return {
-    name: "vite-plugin-svelte:inspector",
-    apply: "serve",
-    enforce: "pre",
-    configResolved(config) {
-      const vps = config.plugins.find((p) => p.name === "vite-plugin-svelte");
-      const options = vps?.api?.options?.experimental?.inspector;
-      if (!vps || !options) {
-        log.debug("inspector disabled, could not find config");
-        disabled = true;
-        return;
-      }
-      inspectorOptions = {
-        ...defaultInspectorOptions,
-        ...options
-      };
-      const isSvelteKit = config.plugins.some((p) => p.name.startsWith("vite-plugin-sveltekit"));
-      if (isSvelteKit && !inspectorOptions.appendTo) {
-        inspectorOptions.appendTo = `/generated/root.svelte`;
-      }
-      appendTo = inspectorOptions.appendTo;
-    },
-    async resolveId(importee, importer, options) {
-      if (options?.ssr || disabled) {
-        return;
-      }
-      if (importee.startsWith("virtual:svelte-inspector-options")) {
-        return importee;
-      } else if (importee.startsWith("virtual:svelte-inspector-path:")) {
-        const resolved = importee.replace("virtual:svelte-inspector-path:", inspectorPath);
-        log.debug.enabled && log.debug(`resolved ${importee} with ${resolved}`);
-        return resolved;
-      }
-    },
-    async load(id, options) {
-      if (options?.ssr || disabled) {
-        return;
-      }
-      if (id === "virtual:svelte-inspector-options") {
-        return `export default ${JSON.stringify(inspectorOptions ?? {})}`;
-      } else if (id.startsWith(inspectorPath)) {
-        const file = idToFile(id);
-        if (fs6.existsSync(file)) {
-          return await fs6.promises.readFile(file, "utf-8");
-        } else {
-          log.error(`failed to find file for svelte-inspector: ${file}, referenced by id ${id}.`);
-        }
-      }
-    },
-    transform(code, id, options) {
-      if (options?.ssr || disabled || !appendTo) {
-        return;
-      }
-      if (id.endsWith(appendTo)) {
-        return { code: `${code}
-import 'virtual:svelte-inspector-path:load-inspector.js'` };
-      }
-    },
-    transformIndexHtml(html) {
-      if (disabled || appendTo) {
-        return;
-      }
-      return {
-        html,
-        tags: [
-          {
-            tag: "script",
-            injectTo: "body",
-            attrs: {
-              type: "module",
-              // /@id/ is needed, otherwise the virtual: is seen as protocol by browser and cors error happens
-              src: "/@id/virtual:svelte-inspector-path:load-inspector.js"
-            }
-          }
-        ]
-      };
-    }
-  };
-}
-
 // src/utils/vite-plugin-svelte-cache.ts
 import { readFileSync as readFileSync2 } from "fs";
 import { dirname } from "path";
 import { findClosestPkgJsonPath } from "vitefu";
-import { normalizePath as normalizePath6 } from "vite";
+import { normalizePath as normalizePath5 } from "vite";
 var VitePluginSvelteCache = class {
   constructor() {
     this._css = /* @__PURE__ */ new Map();
@@ -1955,8 +1831,8 @@ var VitePluginSvelteCache = class {
   getError(svelteRequest) {
     return this._errors.get(svelteRequest.normalizedFilename);
   }
-  getDependants(path10) {
-    const dependants = this._dependants.get(path10);
+  getDependants(path9) {
+    const dependants = this._dependants.get(path9);
     return dependants ? [...dependants] : [];
   }
   getResolvedSvelteField(name, importer) {
@@ -1989,7 +1865,7 @@ async function findPackageInfo(file) {
     version: "0.0.0-unknown",
     path: "$unknown"
   };
-  let path10 = await findClosestPkgJsonPath(file, (pkgPath) => {
+  let path9 = await findClosestPkgJsonPath(file, (pkgPath) => {
     const pkg = JSON.parse(readFileSync2(pkgPath, "utf-8"));
     if (pkg.name != null) {
       info.name = pkg.name;
@@ -2001,17 +1877,17 @@ async function findPackageInfo(file) {
     }
     return false;
   });
-  path10 = normalizePath6(dirname(path10 ?? file)) + "/";
-  info.path = path10;
+  path9 = normalizePath5(dirname(path9 ?? file)) + "/";
+  info.path = path9;
   return info;
 }
 
 // src/utils/load-raw.ts
-import fs7 from "fs";
+import fs6 from "fs";
 async function loadRaw(svelteRequest, compileSvelte2, options) {
   const { id, filename, query } = svelteRequest;
   let compileData;
-  const source = fs7.readFileSync(filename, "utf-8");
+  const source = fs6.readFileSync(filename, "utf-8");
   try {
     svelteRequest.ssr = query.compilerOptions?.generate === "ssr";
     const type = query.type;
@@ -2255,7 +2131,7 @@ function svelte(inlineOptions) {
             }
             if (viteConfig.assetsInclude(filename)) {
               log.debug(`load returns raw content for ${filename}`);
-              return fs8.readFileSync(filename, "utf-8");
+              return fs7.readFileSync(filename, "utf-8");
             }
           }
         }
@@ -2339,10 +2215,16 @@ function svelte(inlineOptions) {
         }
         logCompilerWarnings(svelteRequest, compileData.compiled.warnings, options);
         cache.update(compileData);
-        if (compileData.dependencies?.length && options.server) {
-          compileData.dependencies.forEach((d) => {
-            ensureWatchedFile(options.server.watcher, d, options.root);
-          });
+        if (compileData.dependencies?.length) {
+          if (options.server) {
+            for (const dep of compileData.dependencies) {
+              ensureWatchedFile(options.server.watcher, dep, options.root);
+            }
+          } else if (options.isBuild && viteConfig.build.watch) {
+            for (const dep of compileData.dependencies) {
+              this.addWatchFile(dep);
+            }
+          }
         }
         log.debug(`transform returns compiled js for ${svelteRequest.filename}`);
         return {
@@ -2377,10 +2259,10 @@ Please see ${FAQ_LINK_CONFLICTS_IN_SVELTE_RESOLVE} for details.`
           );
         }
       }
-    }
+    },
+    svelteInspector()
   ];
-  plugins.push(svelteInspector());
-  return plugins.filter(Boolean);
+  return plugins;
 }
 export {
   loadSvelteConfig,