@vizejs/vite-plugin 0.185.0 → 0.186.0

package/dist/index.d.mts

@@ -219,6 +219,10 @@ interface TypeCheckerConfig {
    * Check fallthrough attrs on multi-root templates
    */
   checkFallthroughAttrs?: boolean;
+  /**
+   * Resolve Vue 3 Options API template bindings (data/computed/methods/inject/setup/props) during type checking. Opt-in; available in the standard build (not a legacy feature).
+   */
+  optionsApi?: boolean;
   /**
    * Enable Vue 2.7 / Nuxt 2 Options API template binding support
    */
@@ -788,6 +792,8 @@ interface VizeOptions {
 interface StyleBlockInfo {
   /** Raw style content (uncompiled for preprocessor langs) */
   content: string;
+  /** External source path from `<style src>`, when present */
+  src?: string | null;
   /** Language of the style block (e.g., "css", "scss", "less", "sass", "stylus") */
   lang: string | null;
   /** Whether the style block has the scoped attribute */
@@ -809,6 +815,8 @@ interface CompiledModule {
   macroArtifacts?: MacroArtifact[];
   /** Per-block style metadata extracted from the source SFC */
   styles?: StyleBlockInfo[];
+  /** Files loaded through SFC `src` imports */
+  dependencies?: string[];
 }
 //#endregion
 //#region src/virtual.d.ts

package/dist/index.mjs

@@ -326,16 +326,62 @@ function normalizeStyleBlocks(styles) {
 	if (!styles) return [];
 	return styles.map((block) => ({
 		content: block.content,
+		src: block.src ?? null,
 		lang: block.lang ?? null,
 		scoped: block.scoped,
 		module: block.module ? block.moduleName ?? true : false,
 		index: block.index
 	}));
 }
+function resolveRelativeSrc(filePath, src) {
+	return path.isAbsolute(src) ? src : path.resolve(path.dirname(filePath), src);
+}
+function readSrcImport(filePath, tag, src) {
+	const resolvedPath = resolveRelativeSrc(filePath, src);
+	try {
+		return {
+			path: resolvedPath,
+			content: fs.readFileSync(resolvedPath, "utf-8")
+		};
+	} catch {
+		throw new Error(`[vize] <${tag} src="${src}"> not found (resolved: ${resolvedPath}) in ${filePath}`);
+	}
+}
+function stripSrcAttribute(attrs) {
+	return attrs.replace(/\s*\bsrc\s*=\s*(?:"[^"]*"|'[^']*')/i, "");
+}
+function inlineSingleSrcBlock(source, filePath, tag, src, dependencies) {
+	if (!src) return source;
+	const imported = readSrcImport(filePath, tag, src);
+	dependencies.push(imported.path);
+	const pattern = new RegExp(`<${tag}\\b([^>]*)\\bsrc\\s*=\\s*(['"])[^'"]+\\2([^>]*)>[\\s\\S]*?<\\/${tag}>`, "i");
+	return source.replace(pattern, (_match, beforeSrc, _quote, afterSrc) => {
+		return `<${tag}${stripSrcAttribute(`${beforeSrc}${afterSrc}`)}>\n${imported.content}\n</${tag}>`;
+	});
+}
+function inlineStyleSrcBlocks(source, filePath, dependencies) {
+	return source.replace(/<style\b([^>]*)\bsrc\s*=\s*(['"])([^'"]+)\2([^>]*)>[\s\S]*?<\/style>/gi, (_match, beforeSrc, _quote, src, afterSrc) => {
+		const imported = readSrcImport(filePath, "style", src);
+		dependencies.push(imported.path);
+		return `<style${stripSrcAttribute(`${beforeSrc}${afterSrc}`)}>\n${imported.content}\n</style>`;
+	});
+}
+function resolveSfcSrcImports(filePath, source) {
+	const dependencies = [];
+	const srcInfo = native.extractSfcSrcInfo(source, filePath);
+	let resolvedSource = source;
+	resolvedSource = inlineSingleSrcBlock(resolvedSource, filePath, "script", srcInfo.scriptSrc, dependencies);
+	resolvedSource = inlineSingleSrcBlock(resolvedSource, filePath, "template", srcInfo.templateSrc, dependencies);
+	resolvedSource = inlineStyleSrcBlocks(resolvedSource, filePath, dependencies);
+	return {
+		source: resolvedSource,
+		dependencies
+	};
+}
 function compileFile(filePath, cache, options, source) {
-	const content = source ?? fs.readFileSync(filePath, "utf-8");
+	const resolved = resolveSfcSrcImports(filePath, source ?? fs.readFileSync(filePath, "utf-8"));
 	const scopeId = generateScopeId(filePath);
-	const result = compileSfc(content, buildCompileFileOptions(filePath, options));
+	const result = compileSfc(resolved.source, buildCompileFileOptions(filePath, options));
 	if (result.errors.length > 0) throw new VizeSfcCompileError(filePath, result.errors);
 	if (result.warnings.length > 0) result.warnings.forEach((warning) => {
 		console.warn(`[vize] Warning in ${filePath}: ${warning}`);
@@ -349,7 +395,8 @@ function compileFile(filePath, cache, options, source) {
 		styleHash: result.styleHash,
 		scriptHash: result.scriptHash,
 		macroArtifacts: result.macroArtifacts ?? [],
-		styles: normalizeStyleBlocks(result.styles)
+		styles: normalizeStyleBlocks(result.styles),
+		dependencies: resolved.dependencies
 	};
 	cache.set(filePath, compiled);
 	return compiled;
@@ -359,7 +406,15 @@ function compileFile(filePath, cache, options, source) {
 * Returns per-file results with content hashes for HMR.
 */
 function compileBatch(files, cache, options) {
-	const result = compileSfcBatchWithResults(files, buildCompileBatchOptions(options));
+	const dependenciesByPath = /* @__PURE__ */ new Map();
+	const result = compileSfcBatchWithResults(files.map((file) => {
+		const resolved = resolveSfcSrcImports(file.path, file.source);
+		dependenciesByPath.set(file.path, resolved.dependencies);
+		return {
+			path: file.path,
+			source: resolved.source
+		};
+	}), buildCompileBatchOptions(options));
 	for (const fileResult of result.results) {
 		if (fileResult.errors.length === 0) cache.set(fileResult.path, {
 			code: fileResult.code,
@@ -370,7 +425,8 @@ function compileBatch(files, cache, options) {
 			styleHash: fileResult.styleHash,
 			scriptHash: fileResult.scriptHash,
 			macroArtifacts: fileResult.macroArtifacts ?? [],
-			styles: normalizeStyleBlocks(fileResult.styles)
+			styles: normalizeStyleBlocks(fileResult.styles),
+			dependencies: dependenciesByPath.get(fileResult.path) ?? []
 		});
 		if (fileResult.errors.length > 0) console.error(formatCompileErrorMessage(fileResult.path, fileResult.errors));
 		if (fileResult.warnings.length > 0) fileResult.warnings.forEach((warning) => {
@@ -1300,6 +1356,7 @@ function loadCompiledSfcModule(state, realPath, isSsr, currentBase, loadOptions)
 		extractCss
 	}, realPath, compiled);
 	if (!compiled) return null;
+	for (const dependency of compiled.dependencies ?? []) loadOptions?.addWatchFile?.(dependency);
 	const hasDelegated = hasDelegatedStyles(compiled);
 	const pendingHmrUpdateType = loadOptions?.ssr ? void 0 : state.pendingHmrUpdateTypes.get(realPath);
 	if (compiled.css && !hasDelegated) compiled = {
@@ -1446,8 +1503,33 @@ function formatUnknownError(error) {
 //#region src/plugin/hmr.ts
 const VIZE_COMPONENTS_CSS_BASENAME = "vize-components.css";
 const VIZE_COMPONENTS_CSS_FILE = `assets/${VIZE_COMPONENTS_CSS_BASENAME}`;
+function getVueFilesDependingOn(state, dependencyFile) {
+	const normalizedDependency = path.resolve(dependencyFile);
+	const owners = /* @__PURE__ */ new Set();
+	for (const cache of [state.cache, state.ssrCache]) for (const [vueFile, compiled] of cache) if (compiled.dependencies?.some((dependency) => path.resolve(dependency) === normalizedDependency)) owners.add(vueFile);
+	return [...owners];
+}
 async function handleHotUpdateHook(state, ctx) {
 	const { file, server, read } = ctx;
+	const dependencyOwners = getVueFilesDependingOn(state, file);
+	if (dependencyOwners.length > 0) {
+		const affectedModules = /* @__PURE__ */ new Set();
+		for (const vueFile of dependencyOwners) {
+			state.cache.delete(vueFile);
+			state.ssrCache.delete(vueFile);
+			state.collectedCss.delete(vueFile);
+			state.precompileMetadata.delete(vueFile);
+			state.pendingHmrUpdateTypes.set(vueFile, "full-reload");
+			const virtualId = toVirtualId(vueFile);
+			const modules = server.moduleGraph.getModulesByFile(virtualId) ?? server.moduleGraph.getModulesByFile(vueFile);
+			if (modules) for (const module of modules) {
+				server.moduleGraph.invalidateModule(module);
+				affectedModules.add(module);
+			}
+			state.logger.log(`Invalidated ${path.relative(state.root, vueFile)} because ${path.relative(state.root, file)} changed`);
+		}
+		return [...affectedModules];
+	}
 	if (file.endsWith(".vue") && state.filter(file)) try {
 		const source = await read();
 		const prevCompiled = state.cache.get(file);
@@ -1991,7 +2073,10 @@ function vize(options = {}) {
 				return resolveIdHook(this, state, id, importer, options);
 			},
 			load(id, loadOptions) {
-				return loadHook(state, id, loadOptions);
+				return loadHook(state, id, {
+					...loadOptions,
+					addWatchFile: this.addWatchFile.bind(this)
+				});
 			},
 			async transform(code, id, transformOptions) {
 				return transformHook(state, code, id, transformOptions);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vizejs/vite-plugin",
-  "version": "0.185.0",
+  "version": "0.186.0",
   "description": "High-performance native Vite plugin for Vue SFC compilation powered by Vize",
   "keywords": [
     "compiler",
@@ -39,9 +39,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@vizejs/native": "0.185.0",
+    "@vizejs/native": "0.186.0",
     "tinyglobby": "0.2.16",
-    "vize": "0.185.0"
+    "vize": "0.186.0"
   },
   "devDependencies": {
     "@types/node": "25.7.0",