@sveltejs/vite-plugin-svelte 2.0.1 → 2.0.3

package/dist/index.js

@@ -62,7 +62,7 @@ function _log(logger, message, payload) {
   if (logger.isDebug) {
     payload !== void 0 ? logger.log(message, payload) : logger.log(message);
   } else {
-    logger.log(logger.color(`${new Date().toLocaleTimeString()} [${prefix}] ${message}`));
+    logger.log(logger.color(`${(/* @__PURE__ */ new Date()).toLocaleTimeString()} [${prefix}] ${message}`));
     if (payload) {
       logger.log(payload);
     }
@@ -127,15 +127,19 @@ function logCompilerWarnings(svelteRequest, warnings, options) {
       normalizedFilename: svelteRequest.normalizedFilename,
       timestamp: svelteRequest.timestamp,
       warnings: handledByDefaultWarn,
+      // allWarnings filtered by warnings where onwarn did not call the default handler
       allWarnings,
+      // includes warnings filtered by onwarn and our extra vite plugin svelte warnings
       rawWarnings: warnings
+      // raw compiler output
     };
     log.debug(`sending svelte:warnings message for ${svelteRequest.normalizedFilename}`);
     options.server?.ws?.send("svelte:warnings", message);
   }
 }
 function ignoreCompilerWarning(warning, isBuild, emitCss) {
-  return !emitCss && warning.code === "css-unused-selector" || !isBuild && isNoScopableElementWarning(warning);
+  return !emitCss && warning.code === "css-unused-selector" || // same as rollup-plugin-svelte
+  !isBuild && isNoScopableElementWarning(warning);
 }
 function isNoScopableElementWarning(warning) {
   return warning.code === "css-unused-selector" && warning.message.includes('"*"');
@@ -178,6 +182,62 @@ function buildExtendedLogMessage(w) {
   return parts.join("");
 }
 
+// src/utils/error.ts
+function toRollupError(error, options) {
+  const { filename, frame, start, code, name, stack } = error;
+  const rollupError = {
+    name,
+    // needed otherwise sveltekit coalesce_to_error turns it into a string
+    id: filename,
+    message: buildExtendedLogMessage(error),
+    // include filename:line:column so that it's clickable
+    frame: formatFrameForVite(frame),
+    code,
+    stack: options.isBuild || options.isDebug || !frame ? stack : ""
+  };
+  if (start) {
+    rollupError.loc = {
+      line: start.line,
+      column: start.column,
+      file: filename
+    };
+  }
+  return rollupError;
+}
+function toESBuildError(error, options) {
+  const { filename, frame, start, stack } = error;
+  const partialMessage = {
+    text: buildExtendedLogMessage(error)
+  };
+  if (start) {
+    partialMessage.location = {
+      line: start.line,
+      column: start.column,
+      file: filename,
+      lineText: lineFromFrame(start.line, frame)
+      // needed to get a meaningful error message on cli
+    };
+  }
+  if (options.isBuild || options.isDebug || !frame) {
+    partialMessage.detail = stack;
+  }
+  return partialMessage;
+}
+function lineFromFrame(lineNo, frame) {
+  if (!frame) {
+    return "";
+  }
+  const lines = frame.split("\n");
+  const errorLine = lines.find((line) => line.trimStart().startsWith(`${lineNo}: `));
+  return errorLine ? errorLine.substring(errorLine.indexOf(": ") + 3) : "";
+}
+function formatFrameForVite(frame) {
+  if (!frame) {
+    return "";
+  }
+  return frame.split("\n").map((line) => line.match(/^\s+\^/) ? "   " + line : " " + line.replace(":", " | ")).join("\n");
+}
+
 // src/handle-hot-update.ts
 async function handleHotUpdate(compileSvelte2, ctx, svelteRequest, cache, options) {
   if (!cache.has(svelteRequest)) {
@@ -194,7 +254,7 @@ async function handleHotUpdate(compileSvelte2, ctx, svelteRequest, cache, option
     cache.update(compileData);
   } catch (e) {
     cache.setError(svelteRequest, e);
-    throw e;
+    throw toRollupError(e, options);
   }
   const affectedModules = [...modules];
   const cssIdx = modules.findIndex((m) => m.id === svelteRequest.cssId);
@@ -363,9 +423,8 @@ function addExtraPreprocessors(options, config) {
   }
 }
 
-// src/utils/compile.ts
+// src/utils/sourcemaps.ts
 import path2 from "path";
-var scriptLangRE = /<script [^>]*lang=["']?([^"' >]+)["']?[^>]*>/;
 function mapSourcesToRelative(map, filename) {
   if (map?.sources) {
     map.sources = map.sources.map((s) => {
@@ -378,6 +437,9 @@ function mapSourcesToRelative(map, filename) {
     });
   }
 }
+
+// src/utils/compile.ts
+var scriptLangRE = /<script [^>]*lang=["']?([^"' >]+)["']?[^>]*>/;
 var _createCompileSvelte = (makeHot) => {
   let stats;
   const devStylePreprocessor = createInjectScopeEverythingRulePreprocessorGroup();
@@ -405,6 +467,7 @@ var _createCompileSvelte = (makeHot) => {
     const compileOptions = {
       ...options.compilerOptions,
       filename: normalizedFilename,
+      // use normalized here to avoid bleeding absolute fs path
       generate: ssr ? "ssr" : "dom",
       format: "esm"
     };
@@ -480,6 +543,7 @@ import ${JSON.stringify(cssId)};
         compiled.js.code = makeHot({
           id: filename,
           compiledCode: compiled.js.code,
+          //@ts-expect-error hot isn't a boolean at this point
           hotOptions: { ...options.hot, injectCss: options.hot?.injectCss === true && hasCss },
           compiled,
           originalCode: code,
@@ -492,6 +556,7 @@ import ${JSON.stringify(cssId)};
       filename,
       normalizedFilename,
       lang: code.match(scriptLangRE)?.[1] || "js",
+      // @ts-ignore
       compiled,
       ssr,
       dependencies,
@@ -728,7 +793,7 @@ function findConfigToLoad(viteConfig, inlineOptions) {
 
 // src/utils/constants.ts
 var VITE_RESOLVE_MAIN_FIELDS = ["module", "jsnext:main", "jsnext"];
-var SVELTE_RESOLVE_MAIN_FIELDS = ["svelte", ...VITE_RESOLVE_MAIN_FIELDS];
+var SVELTE_RESOLVE_MAIN_FIELDS = ["svelte"];
 var SVELTE_IMPORTS = [
   "svelte/animate",
   "svelte/easing",
@@ -752,61 +817,6 @@ import path5 from "path";
 // src/utils/esbuild.ts
 import { readFileSync } from "fs";
 import { compile as compile2, preprocess as preprocess2 } from "svelte/compiler";
-
-// src/utils/error.ts
-function toRollupError(error, options) {
-  const { filename, frame, start, code, name, stack } = error;
-  const rollupError = {
-    name,
-    id: filename,
-    message: buildExtendedLogMessage(error),
-    frame: formatFrameForVite(frame),
-    code,
-    stack: options.isBuild || options.isDebug || !frame ? stack : ""
-  };
-  if (start) {
-    rollupError.loc = {
-      line: start.line,
-      column: start.column,
-      file: filename
-    };
-  }
-  return rollupError;
-}
-function toESBuildError(error, options) {
-  const { filename, frame, start, stack } = error;
-  const partialMessage = {
-    text: buildExtendedLogMessage(error)
-  };
-  if (start) {
-    partialMessage.location = {
-      line: start.line,
-      column: start.column,
-      file: filename,
-      lineText: lineFromFrame(start.line, frame)
-    };
-  }
-  if (options.isBuild || options.isDebug || !frame) {
-    partialMessage.detail = stack;
-  }
-  return partialMessage;
-}
-function lineFromFrame(lineNo, frame) {
-  if (!frame) {
-    return "";
-  }
-  const lines = frame.split("\n");
-  const errorLine = lines.find((line) => line.trimStart().startsWith(`${lineNo}: `));
-  return errorLine ? errorLine.substring(errorLine.indexOf(": ") + 3) : "";
-}
-function formatFrameForVite(frame) {
-  if (!frame) {
-    return "";
-  }
-  return frame.split("\n").map((line) => line.match(/^\s+\^/) ? "   " + line : " " + line.replace(":", " | ")).join("\n");
-}
-
-// src/utils/esbuild.ts
 var facadeEsbuildSveltePluginName = "vite-plugin-svelte:facade";
 function esbuildSveltePlugin(options) {
   return {
@@ -932,6 +942,7 @@ var COMMON_DEPENDENCIES_WITHOUT_SVELTE_FIELD = [
   "vite",
   "vitest",
   "__vite-browser-external"
+  // see https://github.com/sveltejs/vite-plugin-svelte/issues/362
 ];
 var COMMON_PREFIXES_WITHOUT_SVELTE_FIELD = [
   "@fontsource/",
@@ -950,6 +961,7 @@ var COMMON_PREFIXES_WITHOUT_SVELTE_FIELD = [
 function isCommonDepWithoutSvelteField(dependency) {
   return COMMON_DEPENDENCIES_WITHOUT_SVELTE_FIELD.includes(dependency) || COMMON_PREFIXES_WITHOUT_SVELTE_FIELD.some(
     (prefix2) => prefix2.startsWith("@") ? dependency.startsWith(prefix2) : dependency.substring(dependency.lastIndexOf("/") + 1).startsWith(prefix2)
+    // check prefix omitting @scope/
   );
 }
 
@@ -960,7 +972,9 @@ import { dirname } from "path";
 import { performance } from "perf_hooks";
 import { normalizePath as normalizePath2 } from "vite";
 var defaultCollectionOptions = {
+  // log after 500ms and more than one file processed
   logInProgress: (c, now) => now - c.collectionStart > 500 && c.stats.length > 1,
+  // always log results
   logResult: () => true
 };
 function humanDuration(n) {
@@ -998,7 +1012,7 @@ function formatPackageStats(pkgStats) {
 }
 async function getClosestNamedPackage(file) {
   let name = "$unknown";
-  let path11 = await findClosestPkgJsonPath(file, (pkgPath) => {
+  let path10 = await findClosestPkgJsonPath(file, (pkgPath) => {
     const pkg = JSON.parse(readFileSync2(pkgPath, "utf-8"));
     if (pkg.name != null) {
       name = pkg.name;
@@ -1006,11 +1020,12 @@ async function getClosestNamedPackage(file) {
     }
     return false;
   });
-  path11 = normalizePath2(dirname(path11 ?? file)) + "/";
-  return { name, path: path11 };
+  path10 = normalizePath2(dirname(path10 ?? file)) + "/";
+  return { name, path: path10 };
 }
 var VitePluginSvelteStats = class {
   constructor() {
+    // package directory -> package name
     this._packages = [];
     this._collections = [];
   }
@@ -1127,6 +1142,7 @@ var knownRootOptions = /* @__PURE__ */ new Set(["extensions", "compilerOptions",
 var allowedInlineOptions = /* @__PURE__ */ new Set([
   "configFile",
   "kit",
+  // only for internal use by sveltekit
   ...allowedPluginOptions,
   ...knownRootOptions
 ]);
@@ -1226,6 +1242,7 @@ function mergeConfigs(...configs) {
   let result = {};
   for (const config of configs.filter((x) => x != null)) {
     result = deepmerge(result, config, {
+      // replace arrays
       arrayMerge: (target, source) => source ?? target
     });
   }
@@ -1356,12 +1373,22 @@ function resolveViteRoot(viteConfig) {
   return normalizePath3(viteConfig.root ? path5.resolve(viteConfig.root) : process.cwd());
 }
 async function buildExtraViteConfig(options, config) {
+  if (!config.resolve) {
+    config.resolve = {};
+  }
+  config.resolve.mainFields = [
+    ...SVELTE_RESOLVE_MAIN_FIELDS,
+    ...config.resolve.mainFields ?? VITE_RESOLVE_MAIN_FIELDS
+  ];
   const extraViteConfig = {
     resolve: {
-      mainFields: [...SVELTE_RESOLVE_MAIN_FIELDS],
       dedupe: [...SVELTE_IMPORTS, ...SVELTE_HMR_IMPORTS],
       conditions: [...SVELTE_EXPORT_CONDITIONS]
     }
+    // this option is still awaiting a PR in vite to be supported
+    // see https://github.com/sveltejs/vite-plugin-svelte/issues/60
+    // @ts-ignore
+    // knownJsSrcExtensions: options.extensions
   };
   const extraSvelteConfig = buildExtraConfigForSvelte(config);
   const extraDepsConfig = await buildExtraConfigForDependencies(options, config);
@@ -1396,14 +1423,20 @@ async function buildExtraViteConfig(options, config) {
   if (options.prebundleSvelteLibraries) {
     extraViteConfig.optimizeDeps = {
       ...extraViteConfig.optimizeDeps,
+      // Experimental Vite API to allow these extensions to be scanned and prebundled
+      // @ts-ignore
       extensions: options.extensions ?? [".svelte"],
+      // Add esbuild plugin to prebundle Svelte files.
+      // Currently a placeholder as more information is needed after Vite config is resolved,
+      // the real Svelte plugin is added in `patchResolvedViteConfig()`
       esbuildOptions: {
         plugins: [{ name: facadeEsbuildSveltePluginName, setup: () => {
         } }]
       }
     };
   }
-  if ((options.hot == null || options.hot === true || options.hot && options.hot.partialAccept !== false) && config.experimental?.hmrPartialAccept !== false) {
+  if ((options.hot == null || options.hot === true || options.hot && options.hot.partialAccept !== false) && // deviate from svelte-hmr, default to true
+  config.experimental?.hmrPartialAccept !== false) {
     log.debug('enabling "experimental.hmrPartialAccept" in vite config');
     extraViteConfig.experimental = { hmrPartialAccept: true };
   }
@@ -1602,7 +1635,9 @@ function setupWatchers(options, cache, requestParser) {
   });
 }
 function ensureWatchedFile(watcher, file, root) {
-  if (file && !file.startsWith(root + "/") && !file.includes("\0") && fs4.existsSync(file)) {
+  if (file && // only need to watch if out of root
+  !file.startsWith(root + "/") && // some rollup plugins use null bytes for private resolved Ids
+  !file.includes("\0") && fs4.existsSync(file)) {
     watcher.add(path6.resolve(file));
   }
 }
@@ -1723,22 +1758,21 @@ function svelteInspector() {
     enforce: "pre",
     configResolved(config) {
       const vps = config.plugins.find((p) => p.name === "vite-plugin-svelte");
-      if (vps?.api?.options?.experimental?.inspector) {
-        inspectorOptions = {
-          ...defaultInspectorOptions,
-          ...vps.api.options.experimental.inspector
-        };
-      }
-      if (!vps || !inspectorOptions) {
+      const options = vps?.api?.options?.experimental?.inspector;
+      if (!vps || !options) {
         log.debug("inspector disabled, could not find config");
         disabled = true;
-      } else {
-        if (vps.api.options.kit && !inspectorOptions.appendTo) {
-          const out_dir = path9.basename(vps.api.options.kit.outDir || ".svelte-kit");
-          inspectorOptions.appendTo = `${out_dir}/generated/root.svelte`;
-        }
-        appendTo = inspectorOptions.appendTo;
+        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) {
@@ -1788,6 +1822,7 @@ import 'virtual:svelte-inspector-path:load-inspector.js'` };
             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"
             }
           }
@@ -1884,8 +1919,8 @@ var VitePluginSvelteCache = class {
   getError(svelteRequest) {
     return this._errors.get(svelteRequest.normalizedFilename);
   }
-  getDependants(path11) {
-    const dependants = this._dependants.get(path11);
+  getDependants(path10) {
+    const dependants = this._dependants.get(path10);
     return dependants ? [...dependants] : [];
   }
   getResolvedSvelteField(name, importer) {
@@ -1913,6 +1948,7 @@ async function loadRaw(svelteRequest, compileSvelte2, options) {
     const type = query.type;
     compileData = await compileSvelte2(svelteRequest, source, {
       ...options,
+      // don't use dynamic vite-plugin-svelte defaults here to ensure stable result between ssr,dev and build
       compilerOptions: {
         dev: false,
         css: false,
@@ -1994,7 +2030,6 @@ function toRawExports(object) {
 }
 
 // src/preprocess.ts
-import path10 from "path";
 import { preprocessCSS, resolveConfig, transformWithEsbuild } from "vite";
 var supportedStyleLangs = ["css", "less", "sass", "scss", "styl", "stylus", "postcss", "sss"];
 var supportedScriptLangs = ["ts"];
@@ -2015,19 +2050,21 @@ function viteScript() {
       const lang = attributes.lang;
       if (!supportedScriptLangs.includes(lang))
         return;
-      const transformResult = await transformWithEsbuild(content, filename, {
+      const { code, map } = await transformWithEsbuild(content, filename, {
         loader: lang,
         target: "esnext",
         tsconfigRaw: {
           compilerOptions: {
+            // svelte typescript needs this flag to work with type imports
             importsNotUsedAsValues: "preserve",
             preserveValueImports: true
           }
         }
       });
+      mapSourcesToRelative(map, filename);
       return {
-        code: transformResult.code,
-        map: transformResult.map
+        code,
+        map
       };
     }
   };
@@ -2053,13 +2090,11 @@ function viteStyle(config = {}) {
       transform = getCssTransformFn(resolvedConfig);
     }
     const moduleId = `${filename}.${lang}`;
-    const result = await transform(content, moduleId);
-    if (result.map?.sources?.[0] === moduleId) {
-      result.map.sources[0] = path10.basename(filename);
-    }
+    const { code, map } = await transform(content, moduleId);
+    mapSourcesToRelative(map, moduleId);
     return {
-      code: result.code,
-      map: result.map ?? void 0
+      code,
+      map: map ?? void 0
     };
   };
   style.__resolvedConfig = null;
@@ -2090,6 +2125,7 @@ function svelte(inlineOptions) {
   const plugins = [
     {
       name: "vite-plugin-svelte",
+      // make sure our resolver runs before vite internal resolver to resolve svelte field correctly
       enforce: "pre",
       api,
       async config(config, configEnv) {
@@ -2228,11 +2264,7 @@ function svelte(inlineOptions) {
         }
         const svelteRequest = requestParser(ctx.file, false, ctx.timestamp);
         if (svelteRequest) {
-          try {
-            return handleHotUpdate(compileSvelte2, ctx, svelteRequest, cache, options);
-          } catch (e) {
-            throw toRollupError(e, options);
-          }
+          return handleHotUpdate(compileSvelte2, ctx, svelteRequest, cache, options);
         }
       },
       async buildEnd() {