@vuebro/loader-sfc 2.0.1 → 2.0.3

package/dist/loader-sfc.js

@@ -1,14 +1,7 @@
-import { compileScript, compileStyleAsync, compileTemplate, parse, } from "@vue/compiler-sfc";
 import hash from "hash-sum";
 import { transform } from "sucrase";
-const log = (msgs) => {
-    msgs.forEach((msg) => {
-        console.log(msg);
-    });
-}, options = {
-    jsxRuntime: "preserve",
-    transforms: ["jsx", "typescript"],
-};
+import { compileScript, compileStyleAsync, compileTemplate, parse, } from "vue/compiler-sfc";
+/* -------------------------------------------------------------------------- */
 const fetchText = async (url) => {
     try {
         const response = await fetch(url);
@@ -21,49 +14,61 @@ const fetchText = async (url) => {
     const objectURL = URL.createObjectURL(new Blob([code], { type: "application/javascript" })), value = (await import(objectURL));
     URL.revokeObjectURL(objectURL);
     return value;
-}, loadModule = async (filename) => {
+}, log = (msgs) => {
+    msgs.forEach((msg) => {
+        console.log(msg);
+    });
+}, options = {
+    jsxRuntime: "preserve",
+    transforms: ["jsx", "typescript"],
+};
+/* -------------------------------------------------------------------------- */
+export default async (filename) => {
+    const id = `data-v-${hash(filename)}`, { descriptor, errors } = parse((await (await fetchText(filename)).text()) || "<template></template>"), { script, scriptSetup, slotted, styles, template } = descriptor;
+    log(errors);
     const compilerOptions = {
         expressionPlugins: ["jsx", "typescript"],
-    }, id = hash(filename), module = {}, { descriptor, errors } = parse((await (await fetchText(filename)).text()) || "<template></template>"), { script, scriptSetup, slotted, styles, template } = descriptor;
-    log(errors);
-    let el = document.getElementById(id);
-    if (!(el instanceof HTMLStyleElement)) {
-        el = document.createElement("style");
+        scopeId: id,
+        slotted,
+    }, scoped = styles.some(({ scoped }) => scoped), component = scoped ? { __scopeId: id } : {};
+    if (!(document.getElementById(id) instanceof HTMLStyleElement)) {
+        const el = document.createElement("style"), warnings = new Set();
         el.id = id;
+        el.textContent = (await Promise.all(styles.map(async ({ content, module, scoped = false, src }) => {
+            const { code, errors } = await compileStyleAsync({
+                filename,
+                id,
+                scoped,
+                source: src ? await (await fetchText(src)).text() : content,
+            });
+            if (module)
+                warnings.add("<style module> is not supported in the playground.");
+            log(errors);
+            return code;
+        }))).join("\n");
         document.head.appendChild(el);
+        log([...warnings]);
     }
-    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 { bindings, content, warnings = [], } = compileScript(descriptor, { id });
-        log(warnings);
-        if (bindings)
+        if (template && bindings)
             compilerOptions.bindingMetadata = bindings;
-        Object.assign(module, (await inject(transform(content, options).code)).default);
+        Object.assign(component, (await inject(transform(content, options).code)).default);
+        log(warnings);
     }
     if (template) {
-        const { content: source } = template;
-        const { code, errors, tips } = compileTemplate({
+        const { ast, content: source } = template, { code, errors, tips } = compileTemplate({
+            ...(ast && { ast }),
             compilerOptions,
             filename,
             id,
-            scoped: styles.some(({ scoped }) => scoped),
+            scoped,
             slotted,
             source,
         });
-        log(errors);
+        Object.assign(component, await inject(transform(code, options).code));
         log(tips);
-        Object.assign(module, await inject(transform(code, options).code));
+        log(errors);
     }
-    return module;
+    return component;
 };
-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": "2.0.1",
+  "version": "2.0.3",
   "type": "module",
   "main": "./dist/loader-sfc.js",
   "types": "./dist/loader-sfc.d.ts",
@@ -31,24 +31,24 @@
     "build": "tsc && vite build"
   },
   "devDependencies": {
-    "@eslint/js": "^9.36.0",
+    "@eslint/js": "^9.37.0",
     "@rollup/plugin-terser": "^0.4.4",
     "@types/hash-sum": "^1.0.2",
     "@types/node": "^24.6.2",
-    "eslint": "^9.36.0",
+    "eslint": "^9.37.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-typescript": "^4.4.4",
     "eslint-plugin-import-x": "^4.16.1",
-    "eslint-plugin-perfectionist": "^4.15.0",
+    "eslint-plugin-perfectionist": "^4.15.1",
     "eslint-plugin-prettier": "^5.5.4",
     "jiti": "^2.6.1",
     "typescript": "^5.9.3",
     "typescript-eslint": "^8.45.0",
-    "vite": "^7.1.8"
+    "vite": "^7.1.9"
   },
   "dependencies": {
-    "@vue/compiler-sfc": "^3.5.22",
     "hash-sum": "^2.0.0",
-    "sucrase": "^3.35.0"
+    "sucrase": "^3.35.0",
+    "vue": "^3.5.22"
   }
 }