@deot/docs-playground 1.1.3 → 1.1.5

package/README.md

@@ -156,6 +156,7 @@ const handleMessage = async () => {
 - Playground 运行时通过公共 CDN 加载 Vue 和默认 import map 中的依赖，手工预览需要网络访问。
 - 默认 CDN 为 `https://cdn.jsdelivr.net/npm`，可通过 `options.cdnURL` 换成 unpkg 等兼容 `/{package}/{file}` 路径的镜像；该地址用于预览样式和内置 import map。
 - `lodash-es` 和在线 Sass 编译器使用 jsDelivr 的 `/+esm` 入口；unpkg 等 CDN 不支持该路径。
+- 直接渲染时，未配置的 npm 模块（含作用域包和子路径）自动从 jsDelivr 的 `/+esm` 入口加载；组件包的传递依赖也适用，`import()` 在调用时加载。`@deot/vc` 的组件、hooks 和 locale 走远程模块加载器，Vue 保持与宿主共用。可用 `options.builtinImportMap.imports` 指定依赖的版本和 URL。
 - Vue SFC 的 `<style lang="scss">` / `lang="sass"` 以及独立 `.scss` / `.sass` 文件会在浏览器里编译；`_partial.scss` 只作为 `@use` 依赖。
 - `options.builtinImportMap.imports` 可以覆盖默认模块 URL。Vue 运行时仍从 `play.vuejs.org` 加载。
 - 每个 Playground 实例都使用自己的 preview 配置和 iframe 消息来源校验。

package/dist/{compile-DSMuM8zl.cjs → compile-29EUKPOy.cjs}

@@ -1,7 +1,4 @@
-const require_scss = require("./scss-DaIqB_qT.cjs");
-const require_files = require("./files-D5LNOtjp.cjs");
-const require_script = require("./script-5Xzzx7u5.cjs");
-const require_local_sandbox = require("./local-sandbox-DnkKrBhf.cjs");
+const require_css = require("./css-DpqJBQ5c.cjs");
 let sass = require("sass");
 //#region packages/playground/src/core/runtime/local/compile/scss.ts
 /**
@@ -21,7 +18,7 @@ var toScssFiles = (files) => {
 };
 var compileLocalScss = (source, filename, files, lang) => {
 	try {
-		return require_scss.compileScssSource(source, filename.replace(/^\/+/u, ""), compiler, toScssFiles(files), lang);
+		return require_css.compileScssSource(source, filename.replace(/^\/+/u, ""), compiler, toScssFiles(files), lang);
 	} catch (error) {
 		/* istanbul ignore next -- Sass 失败时 message 总是字符串 */
 		const message = error instanceof Error ? error.message : String(error);
@@ -188,7 +185,7 @@ var transformJson = (parsed, filename) => {
 	return lines.join("\n");
 };
 var compileOne = async (filename, code, files) => {
-	const ext = require_files.getExtension(filename);
+	const ext = require_css.getExtension(filename);
 	const errors = [];
 	if (ext === ".vue") {
 		if (/lang\s*=\s*["']jsx["']/iu.test(code) || /lang\s*=\s*["']tsx["']/iu.test(code)) {
@@ -204,7 +201,7 @@ var compileOne = async (filename, code, files) => {
 		errors.push(...result.errors);
 		return {
 			filename,
-			js: require_script.transformScript(result.js, filename, { typescript: true }),
+			js: require_css.transformScript(result.js, filename, { typescript: true }),
 			css: result.css,
 			errors
 		};
@@ -216,10 +213,10 @@ var compileOne = async (filename, code, files) => {
 		errors
 	};
 	if (ext === ".scss" || ext === ".sass") try {
-		const css = compileLocalScss(code, filename, files);
+		const { css, exports: styleExports } = require_css.extractScssExports(compileLocalScss(code, filename, files), filename);
 		return {
 			filename,
-			js: `exports.default = {};\n//# sourceURL=playground://${filename}`,
+			js: `exports.__esModule = true; exports.default = ${JSON.stringify(styleExports)};\n//# sourceURL=playground://${filename}`,
 			css,
 			errors
 		};
@@ -248,32 +245,24 @@ var compileOne = async (filename, code, files) => {
 			errors
 		};
 	}
-	if (ext === ".js" || ext === ".ts" || ext === ".jsx" || ext === ".tsx") {
-		if (ext === ".jsx" || ext === ".tsx") {
-			errors.push(`[Playground] JSX/TSX 暂不支持: ${filename}`);
-			return {
-				filename,
-				js: "exports.default = {};",
-				css: "",
-				errors
-			};
-		}
-		try {
-			return {
-				filename,
-				js: require_script.transformScript(code, filename, { typescript: ext === ".ts" }),
-				css: "",
-				errors
-			};
-		} catch (error) {
-			errors.push(messageOf(error));
-			return {
-				filename,
-				js: "exports.default = {};",
-				css: "",
-				errors
-			};
-		}
+	if (ext === ".js" || ext === ".ts" || ext === ".jsx" || ext === ".tsx") try {
+		return {
+			filename,
+			js: require_css.transformScript(code, filename, {
+				typescript: ext === ".ts" || ext === ".tsx",
+				jsx: ext === ".jsx" || ext === ".tsx"
+			}),
+			css: "",
+			errors
+		};
+	} catch (error) {
+		errors.push(messageOf(error));
+		return {
+			filename,
+			js: "exports.default = {};",
+			css: "",
+			errors
+		};
 	}
 	errors.push(`[Playground] 不支持的文件类型: ${filename}`);
 	return {
@@ -294,7 +283,7 @@ var compilePlayground = async (files, entryOrOptions) => {
 	const errors = [];
 	let entry;
 	try {
-		entry = require_files.resolveEntry(files, options.entry);
+		entry = require_css.resolveEntry(files, options.entry);
 	} catch (error) {
 		return {
 			entry: "",
@@ -303,8 +292,8 @@ var compilePlayground = async (files, entryOrOptions) => {
 			errors: [messageOf(error)]
 		};
 	}
-	const fileIndex = require_files.createFileIndex(files);
-	const reachable = require_files.collectReachableFilenames(files, entry);
+	const fileIndex = require_css.createFileIndex(files);
+	const reachable = require_css.collectReachableFilenames(files, entry);
 	const modules = {};
 	const cssChunks = [];
 	for (const filename of reachable) {
@@ -317,9 +306,9 @@ var compilePlayground = async (files, entryOrOptions) => {
 			js: compiled.js,
 			css: compiled.css
 		};
-		cssChunks.push(...require_local_sandbox.collectCss([compiled.css]));
+		cssChunks.push(...require_css.collectCss([compiled.css]));
 	}
-	const normalizedEntry = require_files.normalizeVirtualPath(entry);
+	const normalizedEntry = require_css.normalizeVirtualPath(entry);
 	/* istanbul ignore if -- 可达编译总会留下入口模块 */
 	if (!modules[normalizedEntry]) errors.push(`[Playground] 入口编译结果缺失: ${normalizedEntry}`);
 	return {

package/dist/{compile-Bw7v7QE-.js → compile-CM_OyqYN.js}

@@ -1,7 +1,4 @@
-import { n as compileScssSource } from "./scss-Co2it4vB.js";
-import { collectReachableFilenames, createFileIndex, getExtension, normalizeVirtualPath, resolveEntry } from "./files-C5UMzYxA.js";
-import { n as transformScript } from "./script-xKUjE8pf.js";
-import { n as collectCss } from "./local-sandbox-B8IJ5jWb.js";
+import { a as transformScript, c as createFileIndex, h as resolveEntry, m as normalizeVirtualPath, s as collectReachableFilenames, t as collectCss, u as getExtension, v as compileScssSource, y as extractScssExports } from "./css-DleINdoA.js";
 import { compileString } from "sass";
 //#region packages/playground/src/core/runtime/local/compile/scss.ts
 /**
@@ -216,10 +213,10 @@ var compileOne = async (filename, code, files) => {
 		errors
 	};
 	if (ext === ".scss" || ext === ".sass") try {
-		const css = compileLocalScss(code, filename, files);
+		const { css, exports: styleExports } = extractScssExports(compileLocalScss(code, filename, files), filename);
 		return {
 			filename,
-			js: `exports.default = {};\n//# sourceURL=playground://${filename}`,
+			js: `exports.__esModule = true; exports.default = ${JSON.stringify(styleExports)};\n//# sourceURL=playground://${filename}`,
 			css,
 			errors
 		};
@@ -248,32 +245,24 @@ var compileOne = async (filename, code, files) => {
 			errors
 		};
 	}
-	if (ext === ".js" || ext === ".ts" || ext === ".jsx" || ext === ".tsx") {
-		if (ext === ".jsx" || ext === ".tsx") {
-			errors.push(`[Playground] JSX/TSX 暂不支持: ${filename}`);
-			return {
-				filename,
-				js: "exports.default = {};",
-				css: "",
-				errors
-			};
-		}
-		try {
-			return {
-				filename,
-				js: transformScript(code, filename, { typescript: ext === ".ts" }),
-				css: "",
-				errors
-			};
-		} catch (error) {
-			errors.push(messageOf(error));
-			return {
-				filename,
-				js: "exports.default = {};",
-				css: "",
-				errors
-			};
-		}
+	if (ext === ".js" || ext === ".ts" || ext === ".jsx" || ext === ".tsx") try {
+		return {
+			filename,
+			js: transformScript(code, filename, {
+				typescript: ext === ".ts" || ext === ".tsx",
+				jsx: ext === ".jsx" || ext === ".tsx"
+			}),
+			css: "",
+			errors
+		};
+	} catch (error) {
+		errors.push(messageOf(error));
+		return {
+			filename,
+			js: "exports.default = {};",
+			css: "",
+			errors
+		};
 	}
 	errors.push(`[Playground] 不支持的文件类型: ${filename}`);
 	return {