@deot/docs-playground 1.1.3 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/{cdn-Czve5_9b.cjs → cdn-BoYKnGD3.cjs} +7 -0
- package/dist/{cdn-DEvdGJu2.js → cdn-DQoETju_.js} +2 -1
- package/dist/{compile-Bw7v7QE-.js → compile-BHD98Ttf.js} +24 -32
- package/dist/{compile-DSMuM8zl.cjs → compile-Da095AyM.cjs} +24 -32
- package/dist/{files-C5UMzYxA.js → files-BqucFldk.js} +33 -4
- package/dist/{files-D5LNOtjp.cjs → files-BsAOZiPN.cjs} +93 -18
- package/dist/index.cjs +35 -30
- package/dist/index.js +35 -30
- package/dist/index.style.css +1 -1
- package/dist/{linker-B--sjERT.cjs → linker-DIpEiean.cjs} +2 -2
- package/dist/{linker-JHdz37DK.js → linker-xqjVl0X0.js} +2 -2
- package/dist/{local-sandbox-DnkKrBhf.cjs → local-sandbox-0ojvBQPO.cjs} +12 -8
- package/dist/{local-sandbox-B8IJ5jWb.js → local-sandbox-DvcgaBOa.js} +14 -21
- package/dist/{modules-DlLJF_vd.js → modules-BGzPcoRR.js} +7 -1
- package/dist/{modules-CInmL-8h.cjs → modules-E6kK6ZJH.cjs} +7 -1
- package/dist/{remote-CKMzn1J3.cjs → remote-BG0E1Ugo.cjs} +67 -21
- package/dist/{remote-DfXAsO9n.js → remote-mq4zvrI1.js} +67 -21
- package/dist/script-BiCcpu3G.cjs +111 -0
- package/dist/script-DjUf9uWK.js +98 -0
- package/dist/{scss-DaIqB_qT.cjs → scss-B8OFbz1k.cjs} +23 -5
- package/dist/{scss-Co2it4vB.js → scss-DIh6971q.js} +18 -6
- package/dist/{store-D8vwi-HV.js → store-BOyC8F2y.js} +149 -6
- package/dist/{store-BF7z-oaO.cjs → store-DKawhFZu.cjs} +151 -6
- package/package.json +8 -7
- package/dist/script-5Xzzx7u5.cjs +0 -57
- package/dist/script-xKUjE8pf.js +0 -46
|
@@ -1,7 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { f as resolveModulePath, l as isRelativeSpecifier, r as createFileIndex, t as collectBareSpecifiers } from "./files-BqucFldk.js";
|
|
2
|
+
import { a as resolveNpmImport, c as NEW_SFC_CODE, n as createBuiltinImports, o as DEFAULT_CDN_URL, r as createBuiltinStyles } from "./cdn-DQoETju_.js";
|
|
3
|
+
import { i as whenSassReady, t as bindPlaygroundScss } from "./scss-DIh6971q.js";
|
|
4
|
+
import { n as transformScript, t as rewriteImportMeta } from "./script-DjUf9uWK.js";
|
|
3
5
|
import { nextTick, onBeforeUnmount, ref, unref, watch } from "vue";
|
|
4
6
|
import { File, useStore } from "@vue/repl";
|
|
7
|
+
import { initSync, parse } from "es-module-lexer";
|
|
8
|
+
import * as VueCompiler from "@vue/compiler-sfc/dist/compiler-sfc.esm-browser.js";
|
|
5
9
|
//#region packages/playground/src/core/preview-scroll.ts
|
|
6
10
|
/** iframe 包装成功后挂在 `html` 上,供样式与 auto-height 识别。 */
|
|
7
11
|
var PREVIEW_SCROLL_HTML_CLASS = "docs-playground-preview-scroll";
|
|
@@ -136,14 +140,14 @@ var useSandboxAutoHeight = (sandboxRef) => {
|
|
|
136
140
|
const rootTop = root.getBoundingClientRect().top;
|
|
137
141
|
let childrenBottom = 0;
|
|
138
142
|
for (const child of root.children) {
|
|
139
|
-
if (!(child instanceof HTMLElement)) continue;
|
|
140
143
|
if (view.getComputedStyle(child).position === "fixed") continue;
|
|
141
144
|
const rect = child.getBoundingClientRect();
|
|
142
145
|
const marginBottom = Number.parseFloat(view.getComputedStyle(child).marginBottom) || 0;
|
|
143
146
|
childrenBottom = Math.max(childrenBottom, rect.bottom + marginBottom - rootTop);
|
|
144
147
|
}
|
|
145
148
|
const overflowingHeight = root.scrollHeight > root.clientHeight + 1 ? root.scrollHeight : 0;
|
|
146
|
-
|
|
149
|
+
const naturalHeight = root.classList.contains("docs-playground-local__mount--auto") ? root.offsetHeight : 0;
|
|
150
|
+
return Math.ceil(Math.max(childrenBottom, overflowingHeight, naturalHeight));
|
|
147
151
|
};
|
|
148
152
|
const measureLocalContainer = () => {
|
|
149
153
|
if (!container) return;
|
|
@@ -671,6 +675,128 @@ var PREVIEW_SERVICE_USE_CODE = [
|
|
|
671
675
|
"app.mixin({beforeUnmount(){if(this===this.$root)__docsPlayground.dispose()}});"
|
|
672
676
|
].join("");
|
|
673
677
|
//#endregion
|
|
678
|
+
//#region packages/playground/src/core/repl-modules.ts
|
|
679
|
+
var { babelParse, MagicString, walkIdentifiers } = VueCompiler;
|
|
680
|
+
/**
|
|
681
|
+
* 发现自定义 ESM 的传递引用;缺失的 npm 包映射到 CDN,动态依赖只登记地址。
|
|
682
|
+
* @param imports 当前预览的模块覆盖。
|
|
683
|
+
* @param specifiers 源文件实际引用的模块。
|
|
684
|
+
* @returns 补齐后的 import map。
|
|
685
|
+
*/
|
|
686
|
+
var resolveReplImports = async (imports, specifiers) => {
|
|
687
|
+
initSync();
|
|
688
|
+
const resolved = { ...imports };
|
|
689
|
+
const visited = /* @__PURE__ */ new Set();
|
|
690
|
+
const visit = async (specifier, importer) => {
|
|
691
|
+
const url = isRelativeSpecifier(specifier) || /^https?:\/\//.test(specifier) ? new URL(specifier, importer || location.href).href : resolved[specifier] ||= resolveNpmImport(specifier);
|
|
692
|
+
if (visited.has(url) || /\/\+esm(?:[?#]|$)/.test(url)) return;
|
|
693
|
+
visited.add(url);
|
|
694
|
+
const response = await fetch(url);
|
|
695
|
+
if (!response.ok) throw new Error(`${response.status} ${url}`);
|
|
696
|
+
const modules = parse(await response.text())[0];
|
|
697
|
+
await Promise.all(modules.filter((item) => item.n).map((item) => visit(item.n, url)));
|
|
698
|
+
};
|
|
699
|
+
await Promise.all(specifiers.map((specifier) => visit(specifier)));
|
|
700
|
+
return resolved;
|
|
701
|
+
};
|
|
702
|
+
var rewriteImportedExports = (code) => {
|
|
703
|
+
const statements = babelParse(code, { sourceType: "module" }).program.body;
|
|
704
|
+
const bindings = /* @__PURE__ */ new Map();
|
|
705
|
+
const source = new MagicString(code);
|
|
706
|
+
for (const statement of statements) {
|
|
707
|
+
if (statement.type !== "ImportDeclaration") continue;
|
|
708
|
+
for (const spec of statement.specifiers) {
|
|
709
|
+
if (spec.type === "ImportNamespaceSpecifier") continue;
|
|
710
|
+
const imported = spec.type === "ImportDefaultSpecifier" ? "default" : spec.imported.type === "Identifier" ? spec.imported.name : JSON.stringify(spec.imported.value);
|
|
711
|
+
bindings.set(spec.local.name, {
|
|
712
|
+
imported,
|
|
713
|
+
source: statement.source.value,
|
|
714
|
+
rename: (name) => source.overwrite(spec.local.start, spec.local.end, spec.type === "ImportSpecifier" && spec.imported.start === spec.local.start ? `${imported} as ${name}` : name)
|
|
715
|
+
});
|
|
716
|
+
}
|
|
717
|
+
}
|
|
718
|
+
const aliases = /* @__PURE__ */ new Map();
|
|
719
|
+
const rewritten = /* @__PURE__ */ new Set();
|
|
720
|
+
for (const statement of statements) {
|
|
721
|
+
if (statement.type !== "ExportNamedDeclaration" || statement.source || statement.declaration) continue;
|
|
722
|
+
const exports = statement.specifiers.map((spec) => {
|
|
723
|
+
if (spec.type !== "ExportSpecifier") return "";
|
|
724
|
+
const local = spec.local.name;
|
|
725
|
+
const exported = spec.exported.type === "Identifier" ? spec.exported.name : JSON.stringify(spec.exported.value);
|
|
726
|
+
const binding = bindings.get(local);
|
|
727
|
+
if (!binding) return `export { ${local} as ${exported} };`;
|
|
728
|
+
if (!aliases.has(local)) {
|
|
729
|
+
const alias = `__docs_reexport_${aliases.size}__`;
|
|
730
|
+
aliases.set(local, alias);
|
|
731
|
+
binding.rename(alias);
|
|
732
|
+
}
|
|
733
|
+
return `export { ${binding.imported} as ${exported} } from ${JSON.stringify(binding.source)};`;
|
|
734
|
+
});
|
|
735
|
+
if (statement.specifiers.some((spec) => spec.type === "ExportSpecifier" && bindings.has(spec.local.name))) {
|
|
736
|
+
source.overwrite(statement.start, statement.end, exports.join("\n"));
|
|
737
|
+
rewritten.add(statement);
|
|
738
|
+
}
|
|
739
|
+
}
|
|
740
|
+
for (const statement of statements) {
|
|
741
|
+
if (statement.type === "ImportDeclaration" || rewritten.has(statement)) continue;
|
|
742
|
+
walkIdentifiers(statement, (id, parent) => {
|
|
743
|
+
const alias = aliases.get(id.name);
|
|
744
|
+
if (!alias) return;
|
|
745
|
+
if (parent?.type === "ObjectProperty" && parent.shorthand) source.appendLeft(id.end, `: ${alias}`);
|
|
746
|
+
else source.overwrite(id.start, id.end, alias);
|
|
747
|
+
});
|
|
748
|
+
}
|
|
749
|
+
return source.toString();
|
|
750
|
+
};
|
|
751
|
+
/**
|
|
752
|
+
* REPL 将 ./ 引用按 src 根目录解析,编译结果需要先转成文件表中的完整路径。
|
|
753
|
+
* @param store iframe 预览的文件和编译结果。
|
|
754
|
+
*/
|
|
755
|
+
var bindReplModules = (store) => {
|
|
756
|
+
initSync();
|
|
757
|
+
watch(() => Object.values(store.files).map((file) => [
|
|
758
|
+
file.filename,
|
|
759
|
+
file.code,
|
|
760
|
+
file.compiled.js,
|
|
761
|
+
file.compiled.ssr
|
|
762
|
+
]), () => {
|
|
763
|
+
const files = createFileIndex(Object.fromEntries(Object.entries(store.files).map(([name, file]) => [name, file.code])));
|
|
764
|
+
const importMap = store.getImportMap();
|
|
765
|
+
const imports = { ...importMap.imports };
|
|
766
|
+
let importsChanged = false;
|
|
767
|
+
for (const file of Object.values(store.files)) for (const output of ["js", "ssr"]) {
|
|
768
|
+
if (!file.compiled[output]) continue;
|
|
769
|
+
try {
|
|
770
|
+
let code = /\.[jt]sx?$/.test(file.filename) ? transformScript(file.code, file.filename, {
|
|
771
|
+
esm: true,
|
|
772
|
+
jsx: /\.[jt]sx$/.test(file.filename)
|
|
773
|
+
}) : rewriteImportMeta(file.compiled[output], file.filename);
|
|
774
|
+
code = rewriteImportedExports(code);
|
|
775
|
+
for (const item of [...parse(code)[0]].reverse()) {
|
|
776
|
+
if (!item.n) continue;
|
|
777
|
+
if (isRelativeSpecifier(item.n)) {
|
|
778
|
+
const resolved = resolveModulePath(file.filename, item.n, files);
|
|
779
|
+
if (!resolved) continue;
|
|
780
|
+
const target = `./${resolved.replace(/^\/?src\//, "")}`;
|
|
781
|
+
const text = item.d >= 0 ? JSON.stringify(target) : target;
|
|
782
|
+
code = code.slice(0, item.s) + text + code.slice(item.e);
|
|
783
|
+
} else if (!/^https?:\/\//.test(item.n) && !imports[item.n]) {
|
|
784
|
+
imports[item.n] = resolveNpmImport(item.n);
|
|
785
|
+
importsChanged = true;
|
|
786
|
+
}
|
|
787
|
+
}
|
|
788
|
+
if (file.compiled[output] !== code) file.compiled[output] = code;
|
|
789
|
+
} catch (error) {
|
|
790
|
+
store.errors.push(error instanceof Error ? error : String(error));
|
|
791
|
+
}
|
|
792
|
+
}
|
|
793
|
+
if (importsChanged) store.setImportMap({
|
|
794
|
+
...importMap,
|
|
795
|
+
imports
|
|
796
|
+
});
|
|
797
|
+
}, { immediate: true });
|
|
798
|
+
};
|
|
799
|
+
//#endregion
|
|
674
800
|
//#region packages/playground/src/core/store.ts
|
|
675
801
|
var DOCS_LINK_IMPORT_CODE = "import { h as __docsH } from \"vue\"";
|
|
676
802
|
var DOCS_LINK_USE_CODE = [
|
|
@@ -745,6 +871,7 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
745
871
|
})));
|
|
746
872
|
const mainFile = ref(toReplFilename(entry));
|
|
747
873
|
const activeFilename = ref(toReplFilename(entry));
|
|
874
|
+
const imports = createRuntimeImports(cdnURL, builtinImportMap);
|
|
748
875
|
const store = useStore({
|
|
749
876
|
...storeOptions,
|
|
750
877
|
files: replFiles,
|
|
@@ -752,7 +879,7 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
752
879
|
activeFilename,
|
|
753
880
|
builtinImportMap: ref({
|
|
754
881
|
...builtinImportMap,
|
|
755
|
-
imports
|
|
882
|
+
imports
|
|
756
883
|
}),
|
|
757
884
|
template: ref({
|
|
758
885
|
welcomeSFC: files[entry],
|
|
@@ -760,7 +887,23 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
760
887
|
})
|
|
761
888
|
});
|
|
762
889
|
bindPlaygroundScss(store);
|
|
763
|
-
|
|
890
|
+
bindReplModules(store);
|
|
891
|
+
whenSassReady(files, () => {
|
|
892
|
+
const specifiers = collectBareSpecifiers(files, Object.keys(files));
|
|
893
|
+
if (!specifiers.length) {
|
|
894
|
+
store.init();
|
|
895
|
+
return;
|
|
896
|
+
}
|
|
897
|
+
store.loading = true;
|
|
898
|
+
resolveReplImports(imports, specifiers).then((resolved) => {
|
|
899
|
+
if (Object.keys(resolved).length !== Object.keys(imports).length) store.setImportMap({ imports: resolved }, true);
|
|
900
|
+
store.init();
|
|
901
|
+
}).catch((error) => {
|
|
902
|
+
store.errors.push(error);
|
|
903
|
+
}).finally(() => {
|
|
904
|
+
store.loading = false;
|
|
905
|
+
});
|
|
906
|
+
});
|
|
764
907
|
return store;
|
|
765
908
|
};
|
|
766
909
|
//#endregion
|
|
@@ -1,7 +1,13 @@
|
|
|
1
|
-
const
|
|
2
|
-
const
|
|
1
|
+
const require_rolldown_runtime = require("./rolldown-runtime-C0BPl7ul.cjs");
|
|
2
|
+
const require_cdn = require("./cdn-BoYKnGD3.cjs");
|
|
3
|
+
const require_scss = require("./scss-B8OFbz1k.cjs");
|
|
4
|
+
const require_files = require("./files-BsAOZiPN.cjs");
|
|
5
|
+
const require_script = require("./script-BiCcpu3G.cjs");
|
|
3
6
|
let vue = require("vue");
|
|
4
7
|
let _vue_repl = require("@vue/repl");
|
|
8
|
+
let es_module_lexer = require("es-module-lexer");
|
|
9
|
+
let _vue_compiler_sfc_dist_compiler_sfc_esm_browser_js = require("@vue/compiler-sfc/dist/compiler-sfc.esm-browser.js");
|
|
10
|
+
_vue_compiler_sfc_dist_compiler_sfc_esm_browser_js = require_rolldown_runtime.__toESM(_vue_compiler_sfc_dist_compiler_sfc_esm_browser_js);
|
|
5
11
|
//#region packages/playground/src/core/preview-scroll.ts
|
|
6
12
|
/** iframe 包装成功后挂在 `html` 上,供样式与 auto-height 识别。 */
|
|
7
13
|
var PREVIEW_SCROLL_HTML_CLASS = "docs-playground-preview-scroll";
|
|
@@ -136,14 +142,14 @@ var useSandboxAutoHeight = (sandboxRef) => {
|
|
|
136
142
|
const rootTop = root.getBoundingClientRect().top;
|
|
137
143
|
let childrenBottom = 0;
|
|
138
144
|
for (const child of root.children) {
|
|
139
|
-
if (!(child instanceof HTMLElement)) continue;
|
|
140
145
|
if (view.getComputedStyle(child).position === "fixed") continue;
|
|
141
146
|
const rect = child.getBoundingClientRect();
|
|
142
147
|
const marginBottom = Number.parseFloat(view.getComputedStyle(child).marginBottom) || 0;
|
|
143
148
|
childrenBottom = Math.max(childrenBottom, rect.bottom + marginBottom - rootTop);
|
|
144
149
|
}
|
|
145
150
|
const overflowingHeight = root.scrollHeight > root.clientHeight + 1 ? root.scrollHeight : 0;
|
|
146
|
-
|
|
151
|
+
const naturalHeight = root.classList.contains("docs-playground-local__mount--auto") ? root.offsetHeight : 0;
|
|
152
|
+
return Math.ceil(Math.max(childrenBottom, overflowingHeight, naturalHeight));
|
|
147
153
|
};
|
|
148
154
|
const measureLocalContainer = () => {
|
|
149
155
|
if (!container) return;
|
|
@@ -671,6 +677,128 @@ var PREVIEW_SERVICE_USE_CODE = [
|
|
|
671
677
|
"app.mixin({beforeUnmount(){if(this===this.$root)__docsPlayground.dispose()}});"
|
|
672
678
|
].join("");
|
|
673
679
|
//#endregion
|
|
680
|
+
//#region packages/playground/src/core/repl-modules.ts
|
|
681
|
+
var { babelParse, MagicString, walkIdentifiers } = _vue_compiler_sfc_dist_compiler_sfc_esm_browser_js;
|
|
682
|
+
/**
|
|
683
|
+
* 发现自定义 ESM 的传递引用;缺失的 npm 包映射到 CDN,动态依赖只登记地址。
|
|
684
|
+
* @param imports 当前预览的模块覆盖。
|
|
685
|
+
* @param specifiers 源文件实际引用的模块。
|
|
686
|
+
* @returns 补齐后的 import map。
|
|
687
|
+
*/
|
|
688
|
+
var resolveReplImports = async (imports, specifiers) => {
|
|
689
|
+
(0, es_module_lexer.initSync)();
|
|
690
|
+
const resolved = { ...imports };
|
|
691
|
+
const visited = /* @__PURE__ */ new Set();
|
|
692
|
+
const visit = async (specifier, importer) => {
|
|
693
|
+
const url = require_files.isRelativeSpecifier(specifier) || /^https?:\/\//.test(specifier) ? new URL(specifier, importer || location.href).href : resolved[specifier] ||= require_cdn.resolveNpmImport(specifier);
|
|
694
|
+
if (visited.has(url) || /\/\+esm(?:[?#]|$)/.test(url)) return;
|
|
695
|
+
visited.add(url);
|
|
696
|
+
const response = await fetch(url);
|
|
697
|
+
if (!response.ok) throw new Error(`${response.status} ${url}`);
|
|
698
|
+
const modules = (0, es_module_lexer.parse)(await response.text())[0];
|
|
699
|
+
await Promise.all(modules.filter((item) => item.n).map((item) => visit(item.n, url)));
|
|
700
|
+
};
|
|
701
|
+
await Promise.all(specifiers.map((specifier) => visit(specifier)));
|
|
702
|
+
return resolved;
|
|
703
|
+
};
|
|
704
|
+
var rewriteImportedExports = (code) => {
|
|
705
|
+
const statements = babelParse(code, { sourceType: "module" }).program.body;
|
|
706
|
+
const bindings = /* @__PURE__ */ new Map();
|
|
707
|
+
const source = new MagicString(code);
|
|
708
|
+
for (const statement of statements) {
|
|
709
|
+
if (statement.type !== "ImportDeclaration") continue;
|
|
710
|
+
for (const spec of statement.specifiers) {
|
|
711
|
+
if (spec.type === "ImportNamespaceSpecifier") continue;
|
|
712
|
+
const imported = spec.type === "ImportDefaultSpecifier" ? "default" : spec.imported.type === "Identifier" ? spec.imported.name : JSON.stringify(spec.imported.value);
|
|
713
|
+
bindings.set(spec.local.name, {
|
|
714
|
+
imported,
|
|
715
|
+
source: statement.source.value,
|
|
716
|
+
rename: (name) => source.overwrite(spec.local.start, spec.local.end, spec.type === "ImportSpecifier" && spec.imported.start === spec.local.start ? `${imported} as ${name}` : name)
|
|
717
|
+
});
|
|
718
|
+
}
|
|
719
|
+
}
|
|
720
|
+
const aliases = /* @__PURE__ */ new Map();
|
|
721
|
+
const rewritten = /* @__PURE__ */ new Set();
|
|
722
|
+
for (const statement of statements) {
|
|
723
|
+
if (statement.type !== "ExportNamedDeclaration" || statement.source || statement.declaration) continue;
|
|
724
|
+
const exports = statement.specifiers.map((spec) => {
|
|
725
|
+
if (spec.type !== "ExportSpecifier") return "";
|
|
726
|
+
const local = spec.local.name;
|
|
727
|
+
const exported = spec.exported.type === "Identifier" ? spec.exported.name : JSON.stringify(spec.exported.value);
|
|
728
|
+
const binding = bindings.get(local);
|
|
729
|
+
if (!binding) return `export { ${local} as ${exported} };`;
|
|
730
|
+
if (!aliases.has(local)) {
|
|
731
|
+
const alias = `__docs_reexport_${aliases.size}__`;
|
|
732
|
+
aliases.set(local, alias);
|
|
733
|
+
binding.rename(alias);
|
|
734
|
+
}
|
|
735
|
+
return `export { ${binding.imported} as ${exported} } from ${JSON.stringify(binding.source)};`;
|
|
736
|
+
});
|
|
737
|
+
if (statement.specifiers.some((spec) => spec.type === "ExportSpecifier" && bindings.has(spec.local.name))) {
|
|
738
|
+
source.overwrite(statement.start, statement.end, exports.join("\n"));
|
|
739
|
+
rewritten.add(statement);
|
|
740
|
+
}
|
|
741
|
+
}
|
|
742
|
+
for (const statement of statements) {
|
|
743
|
+
if (statement.type === "ImportDeclaration" || rewritten.has(statement)) continue;
|
|
744
|
+
walkIdentifiers(statement, (id, parent) => {
|
|
745
|
+
const alias = aliases.get(id.name);
|
|
746
|
+
if (!alias) return;
|
|
747
|
+
if (parent?.type === "ObjectProperty" && parent.shorthand) source.appendLeft(id.end, `: ${alias}`);
|
|
748
|
+
else source.overwrite(id.start, id.end, alias);
|
|
749
|
+
});
|
|
750
|
+
}
|
|
751
|
+
return source.toString();
|
|
752
|
+
};
|
|
753
|
+
/**
|
|
754
|
+
* REPL 将 ./ 引用按 src 根目录解析,编译结果需要先转成文件表中的完整路径。
|
|
755
|
+
* @param store iframe 预览的文件和编译结果。
|
|
756
|
+
*/
|
|
757
|
+
var bindReplModules = (store) => {
|
|
758
|
+
(0, es_module_lexer.initSync)();
|
|
759
|
+
(0, vue.watch)(() => Object.values(store.files).map((file) => [
|
|
760
|
+
file.filename,
|
|
761
|
+
file.code,
|
|
762
|
+
file.compiled.js,
|
|
763
|
+
file.compiled.ssr
|
|
764
|
+
]), () => {
|
|
765
|
+
const files = require_files.createFileIndex(Object.fromEntries(Object.entries(store.files).map(([name, file]) => [name, file.code])));
|
|
766
|
+
const importMap = store.getImportMap();
|
|
767
|
+
const imports = { ...importMap.imports };
|
|
768
|
+
let importsChanged = false;
|
|
769
|
+
for (const file of Object.values(store.files)) for (const output of ["js", "ssr"]) {
|
|
770
|
+
if (!file.compiled[output]) continue;
|
|
771
|
+
try {
|
|
772
|
+
let code = /\.[jt]sx?$/.test(file.filename) ? require_script.transformScript(file.code, file.filename, {
|
|
773
|
+
esm: true,
|
|
774
|
+
jsx: /\.[jt]sx$/.test(file.filename)
|
|
775
|
+
}) : require_script.rewriteImportMeta(file.compiled[output], file.filename);
|
|
776
|
+
code = rewriteImportedExports(code);
|
|
777
|
+
for (const item of [...(0, es_module_lexer.parse)(code)[0]].reverse()) {
|
|
778
|
+
if (!item.n) continue;
|
|
779
|
+
if (require_files.isRelativeSpecifier(item.n)) {
|
|
780
|
+
const resolved = require_files.resolveModulePath(file.filename, item.n, files);
|
|
781
|
+
if (!resolved) continue;
|
|
782
|
+
const target = `./${resolved.replace(/^\/?src\//, "")}`;
|
|
783
|
+
const text = item.d >= 0 ? JSON.stringify(target) : target;
|
|
784
|
+
code = code.slice(0, item.s) + text + code.slice(item.e);
|
|
785
|
+
} else if (!/^https?:\/\//.test(item.n) && !imports[item.n]) {
|
|
786
|
+
imports[item.n] = require_cdn.resolveNpmImport(item.n);
|
|
787
|
+
importsChanged = true;
|
|
788
|
+
}
|
|
789
|
+
}
|
|
790
|
+
if (file.compiled[output] !== code) file.compiled[output] = code;
|
|
791
|
+
} catch (error) {
|
|
792
|
+
store.errors.push(error instanceof Error ? error : String(error));
|
|
793
|
+
}
|
|
794
|
+
}
|
|
795
|
+
if (importsChanged) store.setImportMap({
|
|
796
|
+
...importMap,
|
|
797
|
+
imports
|
|
798
|
+
});
|
|
799
|
+
}, { immediate: true });
|
|
800
|
+
};
|
|
801
|
+
//#endregion
|
|
674
802
|
//#region packages/playground/src/core/store.ts
|
|
675
803
|
var DOCS_LINK_IMPORT_CODE = "import { h as __docsH } from \"vue\"";
|
|
676
804
|
var DOCS_LINK_USE_CODE = [
|
|
@@ -745,6 +873,7 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
745
873
|
})));
|
|
746
874
|
const mainFile = (0, vue.ref)(toReplFilename(entry));
|
|
747
875
|
const activeFilename = (0, vue.ref)(toReplFilename(entry));
|
|
876
|
+
const imports = createRuntimeImports(cdnURL, builtinImportMap);
|
|
748
877
|
const store = (0, _vue_repl.useStore)({
|
|
749
878
|
...storeOptions,
|
|
750
879
|
files: replFiles,
|
|
@@ -752,7 +881,7 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
752
881
|
activeFilename,
|
|
753
882
|
builtinImportMap: (0, vue.ref)({
|
|
754
883
|
...builtinImportMap,
|
|
755
|
-
imports
|
|
884
|
+
imports
|
|
756
885
|
}),
|
|
757
886
|
template: (0, vue.ref)({
|
|
758
887
|
welcomeSFC: files[entry],
|
|
@@ -760,7 +889,23 @@ var createRuntimeStore = (files, entry, options) => {
|
|
|
760
889
|
})
|
|
761
890
|
});
|
|
762
891
|
require_scss.bindPlaygroundScss(store);
|
|
763
|
-
|
|
892
|
+
bindReplModules(store);
|
|
893
|
+
require_scss.whenSassReady(files, () => {
|
|
894
|
+
const specifiers = require_files.collectBareSpecifiers(files, Object.keys(files));
|
|
895
|
+
if (!specifiers.length) {
|
|
896
|
+
store.init();
|
|
897
|
+
return;
|
|
898
|
+
}
|
|
899
|
+
store.loading = true;
|
|
900
|
+
resolveReplImports(imports, specifiers).then((resolved) => {
|
|
901
|
+
if (Object.keys(resolved).length !== Object.keys(imports).length) store.setImportMap({ imports: resolved }, true);
|
|
902
|
+
store.init();
|
|
903
|
+
}).catch((error) => {
|
|
904
|
+
store.errors.push(error);
|
|
905
|
+
}).finally(() => {
|
|
906
|
+
store.loading = false;
|
|
907
|
+
});
|
|
908
|
+
});
|
|
764
909
|
return store;
|
|
765
910
|
};
|
|
766
911
|
//#endregion
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deot/docs-playground",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.4",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"exports": {
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
"access": "public"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@deot/docs-locale": "^1.1.
|
|
22
|
-
"@deot/docs-theme": "^1.1.
|
|
23
|
-
"@deot/helper": "^1.1.
|
|
21
|
+
"@deot/docs-locale": "^1.1.2",
|
|
22
|
+
"@deot/docs-theme": "^1.1.2",
|
|
23
|
+
"@deot/helper": "^1.1.20",
|
|
24
24
|
"@deot/http": "^1.1.10",
|
|
25
|
-
"@deot/vc": "^1.2.
|
|
25
|
+
"@deot/vc": "^1.2.3",
|
|
26
26
|
"@codemirror/lang-css": "^6.3.1",
|
|
27
27
|
"@codemirror/lang-javascript": "^6.2.4",
|
|
28
28
|
"@codemirror/lang-vue": "^0.1.3",
|
|
@@ -32,6 +32,7 @@
|
|
|
32
32
|
"codemirror": "^6.0.2",
|
|
33
33
|
"dayjs": "^1.11.23",
|
|
34
34
|
"echarts": "^6.1.0",
|
|
35
|
+
"es-module-lexer": "^2.3.1",
|
|
35
36
|
"highlight.js": "^11.11.1",
|
|
36
37
|
"jspdf": "^3.0.3",
|
|
37
38
|
"jszip": "^3.10.1",
|
|
@@ -43,12 +44,12 @@
|
|
|
43
44
|
"vue-router": "^5.2.0"
|
|
44
45
|
},
|
|
45
46
|
"peerDependencies": {
|
|
46
|
-
"@deot/vc": "^1.2.
|
|
47
|
+
"@deot/vc": "^1.2.3",
|
|
47
48
|
"vue": "^3.5.39"
|
|
48
49
|
},
|
|
49
50
|
"devDependencies": {
|
|
50
51
|
"@deot/style": "^1.1.4",
|
|
51
|
-
"@deot/vc": "^1.2.
|
|
52
|
+
"@deot/vc": "^1.2.3",
|
|
52
53
|
"vue": "^3.5.39"
|
|
53
54
|
}
|
|
54
55
|
}
|
package/dist/script-5Xzzx7u5.cjs
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
let sucrase = require("sucrase");
|
|
2
|
-
//#region packages/playground/src/core/runtime/local/compile/script.ts
|
|
3
|
-
/**
|
|
4
|
-
* files 里的 `import.meta.env` 没有 Vite 注入,接到开发态占位对象上。
|
|
5
|
-
* @param code 源码文本。
|
|
6
|
-
* @param filename 当前虚拟文件名。
|
|
7
|
-
* @returns 替换 `import.meta` 之后的源码。
|
|
8
|
-
*/
|
|
9
|
-
var rewriteImportMeta = (code, filename) => {
|
|
10
|
-
if (!code.includes("import.meta")) return code;
|
|
11
|
-
const meta = {
|
|
12
|
-
url: `playground://${filename}`,
|
|
13
|
-
env: {
|
|
14
|
-
MODE: "development",
|
|
15
|
-
DEV: true,
|
|
16
|
-
PROD: false,
|
|
17
|
-
SSR: false
|
|
18
|
-
}
|
|
19
|
-
};
|
|
20
|
-
return `var import_meta = ${JSON.stringify(meta)};\n${code.replaceAll("import.meta", "import_meta")}`;
|
|
21
|
-
};
|
|
22
|
-
/**
|
|
23
|
-
* 将 TS / ESM 转成可被 `new Function('require','module','exports', code)` 执行的 CJS。
|
|
24
|
-
* @param code 源码文本。
|
|
25
|
-
* @param filename 当前虚拟文件名,用来判断是否按 TypeScript 转换。
|
|
26
|
-
* @param options 转换选项。
|
|
27
|
-
* @param options.typescript 是否启用 TypeScript 转换。
|
|
28
|
-
* @returns 可执行的 CJS 文本。
|
|
29
|
-
*/
|
|
30
|
-
var transformScript = (code, filename, options = {}) => {
|
|
31
|
-
const transforms = ["imports"];
|
|
32
|
-
if (options.typescript === true || options.typescript !== false && (filename.endsWith(".ts") || filename.endsWith(".tsx"))) transforms.unshift("typescript");
|
|
33
|
-
try {
|
|
34
|
-
const withMeta = rewriteImportMeta(code, filename);
|
|
35
|
-
return `${(0, sucrase.transform)(withMeta, {
|
|
36
|
-
transforms,
|
|
37
|
-
production: true,
|
|
38
|
-
filePath: filename
|
|
39
|
-
}).code}\n//# sourceURL=playground://${filename}`;
|
|
40
|
-
} catch (error) {
|
|
41
|
-
const message = error instanceof Error ? error.message : String(error);
|
|
42
|
-
throw new Error(`[Playground] 脚本转换失败 ${filename}: ${message}`, { cause: error });
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
//#endregion
|
|
46
|
-
Object.defineProperty(exports, "rewriteImportMeta", {
|
|
47
|
-
enumerable: true,
|
|
48
|
-
get: function() {
|
|
49
|
-
return rewriteImportMeta;
|
|
50
|
-
}
|
|
51
|
-
});
|
|
52
|
-
Object.defineProperty(exports, "transformScript", {
|
|
53
|
-
enumerable: true,
|
|
54
|
-
get: function() {
|
|
55
|
-
return transformScript;
|
|
56
|
-
}
|
|
57
|
-
});
|
package/dist/script-xKUjE8pf.js
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { transform } from "sucrase";
|
|
2
|
-
//#region packages/playground/src/core/runtime/local/compile/script.ts
|
|
3
|
-
/**
|
|
4
|
-
* files 里的 `import.meta.env` 没有 Vite 注入,接到开发态占位对象上。
|
|
5
|
-
* @param code 源码文本。
|
|
6
|
-
* @param filename 当前虚拟文件名。
|
|
7
|
-
* @returns 替换 `import.meta` 之后的源码。
|
|
8
|
-
*/
|
|
9
|
-
var rewriteImportMeta = (code, filename) => {
|
|
10
|
-
if (!code.includes("import.meta")) return code;
|
|
11
|
-
const meta = {
|
|
12
|
-
url: `playground://${filename}`,
|
|
13
|
-
env: {
|
|
14
|
-
MODE: "development",
|
|
15
|
-
DEV: true,
|
|
16
|
-
PROD: false,
|
|
17
|
-
SSR: false
|
|
18
|
-
}
|
|
19
|
-
};
|
|
20
|
-
return `var import_meta = ${JSON.stringify(meta)};\n${code.replaceAll("import.meta", "import_meta")}`;
|
|
21
|
-
};
|
|
22
|
-
/**
|
|
23
|
-
* 将 TS / ESM 转成可被 `new Function('require','module','exports', code)` 执行的 CJS。
|
|
24
|
-
* @param code 源码文本。
|
|
25
|
-
* @param filename 当前虚拟文件名,用来判断是否按 TypeScript 转换。
|
|
26
|
-
* @param options 转换选项。
|
|
27
|
-
* @param options.typescript 是否启用 TypeScript 转换。
|
|
28
|
-
* @returns 可执行的 CJS 文本。
|
|
29
|
-
*/
|
|
30
|
-
var transformScript = (code, filename, options = {}) => {
|
|
31
|
-
const transforms = ["imports"];
|
|
32
|
-
if (options.typescript === true || options.typescript !== false && (filename.endsWith(".ts") || filename.endsWith(".tsx"))) transforms.unshift("typescript");
|
|
33
|
-
try {
|
|
34
|
-
const withMeta = rewriteImportMeta(code, filename);
|
|
35
|
-
return `${transform(withMeta, {
|
|
36
|
-
transforms,
|
|
37
|
-
production: true,
|
|
38
|
-
filePath: filename
|
|
39
|
-
}).code}\n//# sourceURL=playground://${filename}`;
|
|
40
|
-
} catch (error) {
|
|
41
|
-
const message = error instanceof Error ? error.message : String(error);
|
|
42
|
-
throw new Error(`[Playground] 脚本转换失败 ${filename}: ${message}`, { cause: error });
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
//#endregion
|
|
46
|
-
export { transformScript as n, rewriteImportMeta as t };
|