setupin 2.4.2 → 2.4.3

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.
Files changed (2) hide show
  1. package/dist/main.js +128 -138
  2. package/package.json +1 -1
package/dist/main.js CHANGED
@@ -1,6 +1,53 @@
1
1
  (function () {
2
2
  'use strict';
3
3
 
4
+ function discover(onPrior, onAfter) {
5
+ return new Promise((resolve) => {
6
+ const discovery = /* @__PURE__ */ Object.create(null);
7
+ const observer = new MutationObserver((mutations) => {
8
+ for (const mutation of mutations) {
9
+ mutation.addedNodes.forEach((node) => {
10
+ node instanceof Element && onPrior({ node, discovery, announce });
11
+ });
12
+ }
13
+ });
14
+ observer.observe(document, {
15
+ childList: true,
16
+ subtree: true
17
+ });
18
+ document.addEventListener("DOMContentLoaded", () => {
19
+ onAfter?.({ discovery, announce });
20
+ announce();
21
+ });
22
+ function announce() {
23
+ resolve(discovery);
24
+ observer.disconnect();
25
+ }
26
+ });
27
+ }
28
+
29
+ function isElMatch(el, targetHtml) {
30
+ try {
31
+ const parse = new DOMParser();
32
+ const aimEl = parse.parseFromString(`<body>${targetHtml}</body>`, "text/html").body.firstElementChild;
33
+ const isTag = aimEl?.tagName === el.tagName;
34
+ const nodeAttrs = el.getAttributeNames();
35
+ const aimAttrs = aimEl?.getAttributeNames() ?? [];
36
+ const hasAttr = new Set(aimAttrs).isSubsetOf(new Set(nodeAttrs));
37
+ return isTag && hasAttr;
38
+ } catch {
39
+ return false;
40
+ }
41
+ }
42
+
43
+ function when(gist, verifyer = gist) {
44
+ return function(classify) {
45
+ const sym = Object.getOwnPropertySymbols(classify).find((sym2) => sym2.description === "default");
46
+ const handler = classify[verifyer] ?? (sym && classify[sym]);
47
+ return handler?.(gist);
48
+ };
49
+ }
50
+
4
51
  var lib = {};
5
52
 
6
53
  Object.defineProperty(lib, '__esModule', {
@@ -14027,46 +14074,13 @@
14027
14074
  function extractImport(astBody, code) {
14028
14075
  const imports = astBody.filter(({ type }) => type === "ImportDeclaration").map((node) => code.slice(node.start, node.end));
14029
14076
  return {
14030
- importsCode: imports.map((i) => `${i}
14031
- `).join(""),
14077
+ importsCode: `${imports.join("\n")}
14078
+ `,
14032
14079
  setupCode: `${code.replace(new RegExp(imports.join("|"), "g"), "").trim()}
14033
14080
  `
14034
14081
  };
14035
14082
  }
14036
14083
 
14037
- function discover(onPrior, onAfter) {
14038
- return new Promise((resolve) => {
14039
- const discovery = /* @__PURE__ */ Object.create(null);
14040
- const observer = new MutationObserver((mutations) => {
14041
- for (const mutation of mutations) {
14042
- mutation.addedNodes.forEach((node) => {
14043
- node instanceof Element && onPrior({ node, discovery, announce });
14044
- });
14045
- }
14046
- });
14047
- observer.observe(document, {
14048
- childList: true,
14049
- subtree: true
14050
- });
14051
- document.addEventListener("DOMContentLoaded", () => {
14052
- onAfter?.({ discovery, announce });
14053
- announce();
14054
- });
14055
- function announce() {
14056
- resolve(discovery);
14057
- observer.disconnect();
14058
- }
14059
- });
14060
- }
14061
-
14062
- function when(gist, verifyer = gist) {
14063
- return function(classify) {
14064
- const sym = Object.getOwnPropertySymbols(classify).find((sym2) => sym2.description === "default");
14065
- const handler = classify[verifyer] ?? (sym && classify[sym]);
14066
- return handler?.(gist);
14067
- };
14068
- }
14069
-
14070
14084
  function getGlobalVars(astBody) {
14071
14085
  return astBody.flatMap((node) => when(node, node.type)({
14072
14086
  FunctionDeclaration: ({ id }) => id ? [id.name] : [],
@@ -14108,14 +14122,15 @@
14108
14122
  };
14109
14123
  }
14110
14124
 
14111
- function doByScript(scriptEl) {
14125
+ function parseScript(scriptEl) {
14112
14126
  const scriptContent = scriptEl?.textContent ?? "";
14113
- if (scriptEl) {
14114
- scriptEl.textContent = "";
14115
- } else {
14116
- scriptEl = document.createElement("script");
14117
- document.head.appendChild(scriptEl);
14118
- }
14127
+ when(scriptEl?.tagName ?? 0)({
14128
+ 0: () => {
14129
+ scriptEl = document.createElement("script");
14130
+ document.head.appendChild(scriptEl);
14131
+ },
14132
+ SCRIPT: () => scriptEl.textContent = ""
14133
+ });
14119
14134
  scriptEl.type = "module";
14120
14135
  const { extractImport, getGlobalVars, isAsyncModule } = ast(scriptContent);
14121
14136
  return {
@@ -14128,101 +14143,79 @@
14128
14143
  };
14129
14144
  }
14130
14145
 
14131
- function doByTemplate(templateEl) {
14132
- const templateContent = templateEl?.innerHTML ?? '{{"not found <template>"}}';
14146
+ function parseTemplate(templateEl) {
14147
+ const templateContent = templateEl?.innerHTML ?? "not found &lt;template&gt;";
14133
14148
  templateEl?.remove();
14134
- return templateContent?.replace(/[`"'$\\]/g, (s) => `\\${s}`);
14149
+ return templateContent;
14135
14150
  }
14136
14151
 
14137
- const SCRIPT_TAG = "<script setup>";
14138
- const TEMPLATE_TAG = "<template>";
14139
- var TAG_TYPE = /* @__PURE__ */ ((TAG_TYPE2) => {
14140
- TAG_TYPE2[TAG_TYPE2["WITHOUT"] = 0] = "WITHOUT";
14141
- TAG_TYPE2[TAG_TYPE2["RELATE"] = 1] = "RELATE";
14142
- TAG_TYPE2[TAG_TYPE2["CORRECT"] = 2] = "CORRECT";
14143
- return TAG_TYPE2;
14144
- })(TAG_TYPE || {});
14145
- const root = {
14146
- [SCRIPT_TAG]: {
14147
- lose: () => console.warn(`not found ${SCRIPT_TAG} in top level for document`),
14148
- excess: () => console.warn(`only one ${SCRIPT_TAG} is allowed in top level for document`),
14149
- doBy: doByScript
14150
- },
14151
- [TEMPLATE_TAG]: {
14152
- lose: () => console.error(`not found ${TEMPLATE_TAG} in top level for document`),
14153
- excess: () => console.warn(`only one ${TEMPLATE_TAG} is allowed in top level for document`),
14154
- doBy: doByTemplate
14155
- }
14156
- };
14152
+ function newTag(str, parse, logType, annotation) {
14153
+ return { str, parse, logType, beNoHere: annotation.replace(/%s/g, `${str} is not supposed to be here`) };
14154
+ }
14155
+ const tagScript = newTag("<script setup>", parseScript, { lose: console.warn, excess: console.warn }, "/* %s */");
14156
+ const tagTemplate = newTag("<template>", parseTemplate, { lose: console.error, excess: console.warn }, "<!-- %s -->");
14157
+ const tags = [tagScript, tagTemplate];
14157
14158
 
14158
- const onAfter = ({ discovery }) => {
14159
- if (discovery[SCRIPT_TAG].count === 0) {
14160
- root[SCRIPT_TAG].lose();
14161
- discovery[SCRIPT_TAG].parsed = root[SCRIPT_TAG].doBy();
14162
- }
14163
- if (discovery[TEMPLATE_TAG].count === 0) {
14164
- root[TEMPLATE_TAG].lose();
14165
- discovery[TEMPLATE_TAG].parsed = root[TEMPLATE_TAG].doBy();
14166
- }
14167
- if (discovery[SCRIPT_TAG].count > 1) {
14168
- root[SCRIPT_TAG].excess();
14169
- }
14170
- if (discovery[TEMPLATE_TAG].count > 1) {
14171
- root[TEMPLATE_TAG].excess();
14172
- }
14159
+ function createBehavior(tag) {
14160
+ const { str, parse, logType: { lose, excess }, beNoHere } = tag;
14161
+ return {
14162
+ lose: () => lose(`not found ${str} in top level for document`),
14163
+ excess: () => excess(`only one ${str} is allowed in top level for document`),
14164
+ beNoHere: (node) => node.innerHTML = beNoHere,
14165
+ parse
14166
+ };
14167
+ }
14168
+ const behavior = {
14169
+ [tagScript.str]: createBehavior(tagScript),
14170
+ [tagTemplate.str]: createBehavior(tagTemplate)
14173
14171
  };
14174
14172
 
14175
- const rootTags = {
14176
- [SCRIPT_TAG]: {
14177
- parsed: null,
14178
- count: 0
14179
- },
14180
- [TEMPLATE_TAG]: {
14181
- parsed: null,
14182
- count: 0
14173
+ const onAfter = ({ discovery }) => {
14174
+ for (const { str } of tags) {
14175
+ const { count } = discovery[str];
14176
+ const { lose, excess, parse } = behavior[str];
14177
+ if (count === 0) {
14178
+ lose();
14179
+ discovery[str].parsed = parse();
14180
+ }
14181
+ count > 1 && excess();
14183
14182
  }
14184
14183
  };
14185
14184
 
14186
- function isElMatch(el, targetHtml) {
14187
- try {
14188
- const parse = new DOMParser();
14189
- const aimEl = parse.parseFromString(`<body>${targetHtml}</body>`, "text/html").body.firstElementChild;
14190
- const isTag = aimEl?.tagName === el.tagName;
14191
- const nodeAttrs = el.getAttributeNames();
14192
- const aimAttrs = aimEl?.getAttributeNames() ?? [];
14193
- const hasAttr = aimAttrs?.every((attr) => nodeAttrs.includes(attr));
14194
- return isTag && hasAttr;
14195
- } catch {
14196
- return false;
14197
- }
14185
+ function newCarrier(count, parsed) {
14186
+ return { count, parsed };
14198
14187
  }
14188
+ const carrier = {
14189
+ [tagScript.str]: newCarrier(0, null),
14190
+ [tagTemplate.str]: newCarrier(0, null)
14191
+ };
14199
14192
 
14193
+ var state = /* @__PURE__ */ ((state2) => {
14194
+ state2[state2["WITHOUT"] = 0] = "WITHOUT";
14195
+ state2[state2["RELATE"] = 1] = "RELATE";
14196
+ state2[state2["CORRECT"] = 2] = "CORRECT";
14197
+ return state2;
14198
+ })(state || {});
14199
+ const { WITHOUT, RELATE, CORRECT } = state;
14200
14200
  const onPrior = ({ node, discovery }) => {
14201
- Object.assign(discovery, rootTags);
14202
- function _isRoot(tag) {
14203
- if (!isElMatch(node, tag))
14204
- return TAG_TYPE.WITHOUT;
14205
- if (node.parentElement === document.head)
14206
- return TAG_TYPE.CORRECT;
14207
- else
14208
- return TAG_TYPE.RELATE;
14209
- }
14210
- if (_isRoot(TEMPLATE_TAG) === TAG_TYPE.CORRECT) {
14211
- if (!discovery[TEMPLATE_TAG].count) {
14212
- discovery[TEMPLATE_TAG].parsed = root[TEMPLATE_TAG].doBy(node);
14213
- discovery[TEMPLATE_TAG].count = 0;
14214
- }
14215
- discovery[TEMPLATE_TAG].count++;
14216
- }
14217
- if (_isRoot(SCRIPT_TAG) === TAG_TYPE.CORRECT) {
14218
- if (!discovery[SCRIPT_TAG].count) {
14219
- discovery[SCRIPT_TAG].parsed = root[SCRIPT_TAG].doBy(node);
14220
- discovery[SCRIPT_TAG].count = 0;
14221
- }
14222
- discovery[SCRIPT_TAG].count++;
14223
- }
14224
- if (_isRoot(SCRIPT_TAG) === TAG_TYPE.RELATE)
14225
- node.innerHTML = "/* Resolved to the wrong location */";
14201
+ Object.assign(discovery, carrier);
14202
+ function _getState(tag) {
14203
+ if (!isElMatch(node, tag)) return WITHOUT;
14204
+ if (node.parentElement === document.head) return CORRECT;
14205
+ else return RELATE;
14206
+ }
14207
+ for (const { str } of tags) {
14208
+ if (_getState(str) !== CORRECT) continue;
14209
+ const { parse, beNoHere } = behavior[str];
14210
+ discovery[str].count++;
14211
+ if (discovery[str].count !== 1) {
14212
+ beNoHere(node);
14213
+ continue;
14214
+ }
14215
+ discovery[str].parsed = parse(node);
14216
+ }
14217
+ if (_getState(tagScript.str) === RELATE)
14218
+ behavior[tagScript.str].beNoHere(node);
14226
14219
  };
14227
14220
 
14228
14221
  /**
@@ -14408,25 +14401,22 @@
14408
14401
  withScopeId: nm
14409
14402
  }, Symbol.toStringTag, { value: 'Module' }));
14410
14403
 
14411
- function generate(template, context) {
14404
+ function generate(templateCode, context) {
14405
+ document.body.innerHTML = templateCode;
14406
+ const demandRex = new RegExp(`\\b${Object.keys(window.Vue = Vue).join("\\b|\\b")}\\b`, "g");
14412
14407
  const { importsCode, setupCode, retNames, isAsync } = context;
14413
- const appComp = `{
14414
- template: \`${template}\`,
14415
- ${isAsync ? "async" : ""} setup() {${setupCode}return {${retNames}}},
14416
- }`;
14408
+ const async = isAsync ? "async" : "";
14409
+ const appComp = `{template:document.body.innerHTML, ${async} setup() {${setupCode}return {${retNames}}}}`;
14417
14410
  const suspenseComp = `{components:{c:${appComp}},template:'<Suspense><c/></Suspense>'}`;
14418
14411
  const createApp = `createApp(${isAsync ? suspenseComp : appComp}).mount(document.body);`;
14419
- const autoImport = `const { ${Object.keys(window.Vue = Vue)} } = Vue;`;
14420
- const siteClear = 'document.body.textContent = "";';
14421
- return importsCode + autoImport + siteClear + createApp;
14412
+ const autoImport = `const { createApp,${[...new Set(setupCode.match(demandRex))]} } = Vue;`;
14413
+ return importsCode + autoImport + createApp;
14422
14414
  }
14423
14415
 
14424
- const origin = discover(onPrior, onAfter);
14425
14416
  (async () => {
14426
- const terminal = await origin;
14427
- const { scriptEl, context } = terminal[SCRIPT_TAG].parsed;
14428
- const templateContent = terminal[TEMPLATE_TAG].parsed;
14429
- scriptEl.textContent = generate(templateContent, context);
14417
+ const discovery = await discover(onPrior, onAfter);
14418
+ const { scriptEl, context } = discovery[tagScript.str].parsed;
14419
+ scriptEl.innerHTML = generate(discovery[tagTemplate.str].parsed, context);
14430
14420
  })();
14431
14421
 
14432
14422
  })();
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "setupin",
3
3
  "type": "module",
4
- "version": "2.4.2",
4
+ "version": "2.4.3",
5
5
  "description": "Vue SFC? HTML! <script setup> in html",
6
6
  "author": "tofu-xx <tofu-xx@foxmail.com>",
7
7
  "license": "MIT",