@vuebro/loader-sfc 1.6.0 → 2.0.0

package/dist/loader-sfc.js

@@ -1,94 +1,74 @@
 import { compileScript, compileStyleAsync, compileTemplate, parse, } from "@vue/compiler-sfc";
-import { useStyleTag } from "@vueuse/core";
 import hash from "hash-sum";
 import { transform } from "sucrase";
-const body = "<template></template>", fetchText = async (url) => {
+const log = (msgs) => {
+    msgs.forEach((msg) => {
+        console.log(msg);
+    });
+}, options = {
+    jsxRuntime: "preserve",
+    transforms: ["jsx", "typescript"],
+};
+const fetchText = async (url) => {
     try {
         const response = await fetch(url);
-        return response.ok ? response : new Response(body);
+        return response.ok ? response : new Response("");
     }
     catch {
-        return new Response(body);
+        return new Response("");
     }
-}, log = (msgs) => {
-    msgs.forEach((msg) => {
-        console.log(msg);
-    });
-};
-const addStyle = async (id, { filename }, { content, module, scoped = false, src }) => {
-    const { code, errors } = await compileStyleAsync({
-        filename,
-        id,
-        modules: !!module,
-        scoped,
-        source: src ? await (await fetchText(src)).text() : content,
-    });
-    log(errors);
-    useStyleTag(code, scoped ? { id } : undefined);
 }, inject = async (code) => {
-    const objectURL = URL.createObjectURL(new Blob([code], { type: "application/javascript" })), 
-    /* @vite-ignore */
-    value = (await import(objectURL));
+    const objectURL = URL.createObjectURL(new Blob([code], { type: "application/javascript" })), value = (await import(objectURL));
     URL.revokeObjectURL(objectURL);
     return value;
 }, loadModule = async (filename) => {
-    const id = `data-v-${hash(filename)}`, { descriptor, errors } = parse((await (await fetchText(filename)).text()) || body, { filename });
-    const compilerOptions = {
-        cacheHandlers: true,
-        comments: false,
-        expressionPlugins: [],
-        hoistStatic: true,
-        optimizeImports: true,
-        scopeId: id,
-        sourceMap: false,
-        ssr: false,
-    }, scriptBlocks = ["script", "scriptSetup"], contents = await Promise.all(scriptBlocks.map(async (key) => {
-        const { lang = "js", src } = (descriptor[key] ?? {});
-        if (/[jt]sx$/.test(lang))
-            compilerOptions.expressionPlugins?.push("jsx");
-        if (/tsx?$/.test(lang))
-            compilerOptions.expressionPlugins?.push("typescript");
-        return src && (await (await fetchText(src)).text());
-    })), jsxRuntime = "preserve", module = {}, scoped = descriptor.styles.some(({ scoped }) => scoped), { expressionPlugins: transforms } = compilerOptions;
+    const id = hash(filename), { descriptor, errors } = parse((await (await fetchText(filename)).text()) || "<template></template>"), { script, scriptSetup, slotted, styles, template } = descriptor;
+    const templateOptions = {
+        compilerOptions: {
+            expressionPlugins: ["jsx", "typescript"],
+        },
+        scoped: styles.some(({ scoped }) => scoped),
+        slotted,
+    };
     log(errors);
-    if (scoped)
-        module.__scopeId = id;
-    if (descriptor.script || descriptor.scriptSetup) {
-        scriptBlocks.forEach((key, i) => {
-            const scriptBlock = descriptor[key];
-            if (scriptBlock && contents[i] !== undefined)
-                scriptBlock.content = contents[i];
+    let el = document.getElementById(id);
+    if (!(el instanceof HTMLStyleElement)) {
+        el = document.createElement("style");
+        el.id = id;
+        document.head.appendChild(el);
+    }
+    el.textContent = (await Promise.all(styles.map(async ({ content, module, scoped = false, src }) => {
+        const { code, errors } = await compileStyleAsync({
+            filename,
+            id,
+            modules: !!module,
+            scoped,
+            source: src ? await (await fetchText(src)).text() : content,
+        });
+        log(errors);
+        return code;
+    }))).join("\n");
+    if (script || scriptSetup) {
+        const { content, warnings = [] } = compileScript(descriptor, {
+            id,
+            ...(template ? templateOptions : {}),
         });
-        const { bindings, content, warnings = [], } = compileScript(descriptor, { id });
         log(warnings);
-        if (bindings)
-            compilerOptions.bindingMetadata = bindings;
-        Object.assign(module, (await inject(transforms.length
-            ? transform(content, { jsxRuntime, transforms }).code
-            : content)).default);
+        return inject(transform(content, options).code);
     }
-    if (descriptor.template) {
+    else if (template) {
+        const { content: source } = template;
         const { code, errors, tips } = compileTemplate({
-            ast: descriptor.template.ast,
-            compilerOptions,
-            filename: descriptor.filename,
+            ...templateOptions,
+            filename,
             id,
-            scoped,
-            slotted: descriptor.slotted,
-            source: descriptor.template.src
-                ? await (await fetchText(descriptor.template.src)).text()
-                : descriptor.template.content,
-            // @ts-expect-error TODO remove expect-error after 3.6
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-            vapor: descriptor.vapor,
+            source,
         });
         log(errors);
         log(tips);
-        Object.assign(module, await inject(transforms.length
-            ? transform(code, { jsxRuntime, transforms }).code
-            : code));
+        return inject(transform(code, options).code);
     }
-    await Promise.all(descriptor.styles.map((style) => addStyle(id, descriptor, style)));
-    return module;
+    else
+        return {};
 };
 export default loadModule;

package/package.json

@@ -21,7 +21,7 @@
     "url": "git+https://github.com/vuebro/loader-sfc.git"
   },
   "license": "AGPL-3.0-only",
-  "version": "1.6.0",
+  "version": "2.0.0",
   "type": "module",
   "main": "./dist/loader-sfc.js",
   "types": "./dist/loader-sfc.d.ts",
@@ -34,7 +34,7 @@
     "@eslint/js": "^9.36.0",
     "@rollup/plugin-terser": "^0.4.4",
     "@types/hash-sum": "^1.0.2",
-    "@types/node": "^24.6.1",
+    "@types/node": "^24.6.2",
     "eslint": "^9.36.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-typescript": "^4.4.4",
@@ -44,12 +44,12 @@
     "jiti": "^2.6.1",
     "typescript": "^5.9.3",
     "typescript-eslint": "^8.45.0",
-    "vite": "^7.1.7"
+    "vite": "^7.1.8"
   },
   "dependencies": {
     "@vue/compiler-sfc": "^3.5.22",
-    "@vueuse/core": "^13.9.0",
     "hash-sum": "^2.0.0",
-    "sucrase": "^3.35.0"
+    "sucrase": "^3.35.0",
+    "vue": "^3.5.22"
   }
 }