@vuebro/loader-sfc 2.3.11 → 2.3.12

package/dist/loader-sfc.js

@@ -1,14 +1,18 @@
+import { compileStyleAsync, compileTemplate, compileScript, parse, } from "vue/compiler-sfc";
 import { consola } from "consola/browser";
-import hash from "hash-sum";
 import { transform } from "sucrase";
-import { compileScript, compileStyleAsync, compileTemplate, parse, } from "vue/compiler-sfc";
-const fetchText = async (url) => {
+import hash from "hash-sum";
+const fetchText = async (input, text = "") => {
     try {
-        const response = await fetch(url);
-        return response.ok ? response : new Response("");
+        const response = await fetch(input);
+        if (response.ok)
+            return await response.text();
+        else
+            throw new Error(`Response status: ${response.status.toString()}`);
     }
-    catch {
-        return new Response("");
+    catch (error) {
+        consola.error(error);
+        return text;
     }
 }, inject = async (code) => {
     const objectURL = URL.createObjectURL(new Blob([code], { type: "application/javascript" }));
@@ -19,32 +23,32 @@ const fetchText = async (url) => {
         URL.revokeObjectURL(objectURL);
     }
 };
-export default async (filename, { parseOptions, scriptOptions: { templateOptions: { compilerOptions: { expressionPlugins, ...restCompilerOptions } = {}, ...restTemplateOptions } = {}, ...restScriptOptions } = {}, styleOptions, } = {}) => {
+export default async (filename, { scriptOptions: { templateOptions: { compilerOptions: { expressionPlugins, ...restCompilerOptions } = {}, ...restTemplateOptions } = {}, ...restScriptOptions } = {}, parseOptions, styleOptions, } = {}) => {
     const id = `data-v-${hash(filename)}`;
-    const { descriptor, errors: parseErrors } = parse((await (await fetchText(filename)).text()) || "<template></template>", { filename, ...parseOptions });
-    const { script, scriptSetup, slotted, styles, template } = descriptor;
+    const { errors: parseErrors, descriptor } = parse(await fetchText(filename, "<template></template>"), { filename, ...parseOptions });
+    const { scriptSetup, template, slotted, script, styles } = descriptor;
     const langs = new Set([script, scriptSetup]
         .filter((scriptBlock) => scriptBlock !== null)
         .flatMap(({ lang = "js" }) => [
         ...(/[jt]sx$/.test(lang) ? ["jsx"] : []),
         ...(/tsx?$/.test(lang) ? ["typescript"] : []),
-    ])), { ast, content: source = "" } = template ?? {};
+    ])), { content: source = "", ast } = template ?? {};
     let styleWarning = "";
     const styleErrors = [];
     const style = !(document.getElementById(id) instanceof HTMLStyleElement)
-        ? Promise.all(styles.map(async ({ content, module, scoped = false, src }) => {
+        ? Promise.all(styles.map(async ({ scoped = false, content, module, src }) => {
             const modules = !!module;
             if (modules && !styleWarning) {
                 styleWarning = "<style module> is not supported in the playground.";
                 return "";
             }
             else {
-                const { code, errors } = await compileStyleAsync({
+                const { errors, code } = await compileStyleAsync({
+                    source: src ? await fetchText(src) : content,
                     filename,
-                    id,
                     modules,
                     scoped,
-                    source: src ? await (await fetchText(src)).text() : content,
+                    id,
                     ...styleOptions,
                 });
                 styleErrors.push(...errors);
@@ -56,34 +60,34 @@ export default async (filename, { parseOptions, scriptOptions: { templateOptions
         expressionPlugins: [
             ...new Set([...(expressionPlugins ?? []), ...langs]),
         ],
-        filename,
         scopeId: id,
+        filename,
         slotted,
         ...restCompilerOptions,
     }, templateOptions = {
+        scoped: styles.some(({ scoped }) => scoped),
         compilerOptions,
         filename,
-        id,
-        scoped: styles.some(({ scoped }) => scoped),
         slotted,
+        id,
         ...restTemplateOptions,
     }, scriptOptions = {
-        id,
         templateOptions,
+        id,
         ...restScriptOptions,
     }, sucraseOptions = {
-        jsxRuntime: "preserve",
         transforms: [...langs],
+        jsxRuntime: "preserve",
     };
-    const { bindings, content, warnings: scriptWarnings, } = script || scriptSetup ? compileScript(descriptor, scriptOptions) : {};
+    const { warnings: scriptWarnings, bindings, content, } = script || scriptSetup ? compileScript(descriptor, scriptOptions) : {};
     if (bindings)
         compilerOptions.bindingMetadata = bindings;
-    const { code, errors: templateErrors, tips: templateTips, } = template && (!scriptSetup || !scriptOptions.inlineTemplate)
+    const { errors: templateErrors, tips: templateTips, code, } = template && (!scriptSetup || !scriptOptions.inlineTemplate)
         ? compileTemplate({
             ...ast,
             filename,
-            id,
             source,
+            id,
             ...templateOptions,
         })
         : {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuebro/loader-sfc",
-  "version": "2.3.11",
+  "version": "2.3.12",
   "description": "Vue3 Single File Component (SFC) loader. Load .vue files directly from your browser without any build step.",
   "keywords": [
     "vue",
@@ -34,15 +34,13 @@
   },
   "prettier": "@vuebro/configs/prettierrc",
   "dependencies": {
-    "consola": "^3.4.2",
     "hash-sum": "^2.0.0",
-    "sucrase": "^3.35.0",
-    "vue": "^3.5.22"
+    "sucrase": "^3.35.0"
   },
   "devDependencies": {
     "@rollup/plugin-terser": "^0.4.4",
     "@types/hash-sum": "^1.0.2",
     "@types/node": "^24.9.1",
-    "@vuebro/configs": "^1.1.34"
+    "@vuebro/configs": "^1.1.38"
   }
 }