@vuebro/loader-sfc 2.3.34 → 2.3.35

package/README.md

@@ -41,8 +41,8 @@ To load .vue files dynamically at runtime just use the `loadModule` function:
 import { defineAsyncComponent } from "vue";
 import loadModule from "@vuebro/loader-sfc";
 
-const AdminPage = defineAsyncComponent(() =>
-  loadModule("./components/AdminPageComponent.vue"),
+const AdminPage = defineAsyncComponent(async () =>
+  loadModule(await (await fetch("./components/AdminPageComponent.vue")).text()),
 );
 </script>
 
@@ -59,8 +59,8 @@ You can pass configuration options to customize the compilation process:
 import { defineAsyncComponent } from "vue";
 import loadModule from "@vuebro/loader-sfc";
 
-const MyComponent = defineAsyncComponent(() =>
-  loadModule("./components/MyComponent.vue", {
+const MyComponent = defineAsyncComponent(async () =>
+  loadModule(await (await fetch("./components/MyComponent.vue")).text(), {
     scriptOptions: {
       templateOptions: {
         compilerOptions: {

package/dist/loader-sfc.esm-browser.prod.js

@@ -23757,9 +23757,7 @@ const ZP = async (e) => {
   }
 }, eA = async (e, { parseOptions: t, scriptOptions: { templateOptions: { compilerOptions: { expressionPlugins: s, ...n } = {}, ...i } = {}, ...o } = {}, styleOptions: c } = {}) => {
   let l = "";
-  const p = [], { descriptor: d, errors: f } = ab(e || "<template></template>", t), { filename: m, script: x, scriptSetup: g, slotted: y, styles: v, template: T } = d;
-  console.log({ filename: m });
-  const k = `data-v-${KT(m)}`, E = new Set([x, g].filter((se) => se !== null).flatMap(({ lang: se = "js" }) => [.../[jt]sx$/.test(se) ? ["jsx"] : [], .../tsx?$/.test(se) ? ["typescript"] : []])), C = { expressionPlugins: [.../* @__PURE__ */ new Set([...s ?? [], ...E])], filename: m, scopeId: k, slotted: y, ...n }, A = { compilerOptions: C, filename: m, id: k, scoped: v.some(({ scoped: se }) => se), slotted: y, ...i }, O = { id: k, templateOptions: A, ...o }, F = document.getElementById(k) instanceof HTMLStyleElement ? Promise.resolve([]) : Promise.all(v.map(async ({ content: se, module: J, scoped: $ = !1, src: oe }) => {
+  const p = [], { descriptor: d, errors: f } = ab(e || "<template></template>", t), { filename: m, script: x, scriptSetup: g, slotted: y, styles: v, template: T } = d, k = `data-v-${KT(e)}`, E = new Set([x, g].filter((se) => se !== null).flatMap(({ lang: se = "js" }) => [.../[jt]sx$/.test(se) ? ["jsx"] : [], .../tsx?$/.test(se) ? ["typescript"] : []])), C = { expressionPlugins: [.../* @__PURE__ */ new Set([...s ?? [], ...E])], filename: m, scopeId: k, slotted: y, ...n }, A = { compilerOptions: C, filename: m, id: k, scoped: v.some(({ scoped: se }) => se), slotted: y, ...i }, O = { id: k, templateOptions: A, ...o }, F = document.getElementById(k) instanceof HTMLStyleElement ? Promise.resolve([]) : Promise.all(v.map(async ({ content: se, module: J, scoped: $ = !1, src: oe }) => {
     const Y = !!J;
     if (Y && !l) return l = "<style module> is not supported in the playground.", "";
     {

package/dist/loader-sfc.js

@@ -23,8 +23,7 @@ const fetching = async (input) => {
 export default async (sfc, { parseOptions, scriptOptions: { templateOptions: { compilerOptions: { expressionPlugins, ...restCompilerOptions } = {}, ...restTemplateOptions } = {}, ...restScriptOptions } = {}, styleOptions, } = {}) => {
     let styleWarning = "";
     const styleErrors = [], { descriptor, errors: parseErrors } = parse(sfc || "<template></template>", parseOptions), { filename, script, scriptSetup, slotted, styles, template } = descriptor;
-    console.log({ filename });
-    const id = `data-v-${hash(filename)}`, langs = new Set([script, scriptSetup]
+    const id = `data-v-${hash(sfc)}`, langs = new Set([script, scriptSetup]
         .filter((scriptBlock) => scriptBlock !== null)
         .flatMap(({ lang = "js" }) => [
         ...(/[jt]sx$/.test(lang) ? ["jsx"] : []),

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://www.schemastore.org/package",
   "name": "@vuebro/loader-sfc",
-  "version": "2.3.34",
+  "version": "2.3.35",
   "description": "A lightweight library that enables loading Vue 3 Single File Components (.vue files) directly in the browser at runtime without requiring a build step. Supports TypeScript and JSX transformations for dynamic component loading.",
   "keywords": [
     "vue",