@dimina/compiler 1.0.12-beta.9 → 1.0.13

package/dist/core/style-compiler.cjs

@@ -1,223 +1,237 @@
-"use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const fs = require("node:fs");
-const path = require("node:path");
-const node_worker_threads = require("node:worker_threads");
-const compilerSfc = require("@vue/compiler-sfc");
-const autoprefixer = require("autoprefixer");
-const cssnano = require("cssnano");
-const less = require("less");
-const postcss = require("postcss");
-const selectorParser = require("postcss-selector-parser");
-const sass = require("sass");
-const env = require("../env-Cmen1qwy.cjs");
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const sass__namespace = /* @__PURE__ */ _interopNamespaceDefault(sass);
-const fileType = [".wxss", ".ddss", ".less", ".scss", ".sass"];
-const compileRes = /* @__PURE__ */ new Map();
-if (!node_worker_threads.isMainThread) {
-  node_worker_threads.parentPort.on("message", async ({ pages, storeInfo }) => {
-    try {
-      env.resetStoreInfo(storeInfo);
-      const progress = {
-        _completedTasks: 0,
-        get completedTasks() {
-          return this._completedTasks;
-        },
-        set completedTasks(value) {
-          this._completedTasks = value;
-          node_worker_threads.parentPort.postMessage({ completedTasks: this._completedTasks });
-        }
-      };
-      await compileSS(pages.mainPages, null, progress);
-      for (const [root, subPages] of Object.entries(pages.subPages)) {
-        await compileSS(subPages.info, root, progress);
-      }
-      compileRes.clear();
-      node_worker_threads.parentPort.postMessage({ success: true });
-    } catch (error) {
-      compileRes.clear();
-      node_worker_threads.parentPort.postMessage({
-        success: false,
-        error: {
-          message: error.message,
-          stack: error.stack,
-          name: error.name
-        }
-      });
-    }
-  });
-}
+const require_env = require("../env-lm96AacS.cjs");
+let node_path = require("node:path");
+node_path = require_env.__toESM(node_path);
+let node_worker_threads = require("node:worker_threads");
+let node_fs = require("node:fs");
+node_fs = require_env.__toESM(node_fs);
+let _vue_compiler_sfc = require("@vue/compiler-sfc");
+let autoprefixer = require("autoprefixer");
+autoprefixer = require_env.__toESM(autoprefixer);
+let cssnano = require("cssnano");
+cssnano = require_env.__toESM(cssnano);
+let less = require("less");
+less = require_env.__toESM(less);
+let postcss = require("postcss");
+postcss = require_env.__toESM(postcss);
+let postcss_selector_parser = require("postcss-selector-parser");
+postcss_selector_parser = require_env.__toESM(postcss_selector_parser);
+let sass = require("sass");
+sass = require_env.__toESM(sass);
+//#region src/core/style-compiler.js
+var fileType = [
+	".wxss",
+	".ddss",
+	".less",
+	".scss",
+	".sass"
+];
+var compileRes = /* @__PURE__ */ new Map();
+if (!node_worker_threads.isMainThread) node_worker_threads.parentPort.on("message", async ({ pages, storeInfo }) => {
+	try {
+		require_env.resetStoreInfo(storeInfo);
+		const progress = {
+			_completedTasks: 0,
+			get completedTasks() {
+				return this._completedTasks;
+			},
+			set completedTasks(value) {
+				this._completedTasks = value;
+				node_worker_threads.parentPort.postMessage({ completedTasks: this._completedTasks });
+			}
+		};
+		await compileSS(pages.mainPages, null, progress);
+		for (const [root, subPages] of Object.entries(pages.subPages)) await compileSS(subPages.info, root, progress);
+		compileRes.clear();
+		node_worker_threads.parentPort.postMessage({ success: true });
+	} catch (error) {
+		compileRes.clear();
+		node_worker_threads.parentPort.postMessage({
+			success: false,
+			error: {
+				message: error.message,
+				stack: error.stack,
+				name: error.name
+			}
+		});
+	}
+});
+/**
+*  编译样式文件
+*/
 async function compileSS(pages, root, progress) {
-  for (const page of pages) {
-    const code = await buildCompileCss(page, []) || "";
-    const filename = `${page.path.replace(/\//g, "_")}`;
-    if (root) {
-      const subDir = `${env.getTargetPath()}/${root}`;
-      if (!fs.existsSync(subDir)) {
-        fs.mkdirSync(subDir, { recursive: true });
-      }
-      fs.writeFileSync(`${subDir}/${filename}.css`, code);
-    } else {
-      const mainDir = `${env.getTargetPath()}/main`;
-      if (!fs.existsSync(mainDir)) {
-        fs.mkdirSync(mainDir, { recursive: true });
-      }
-      fs.writeFileSync(`${mainDir}/${filename}.css`, code);
-    }
-    progress.completedTasks++;
-  }
+	for (const page of pages) {
+		const code = await buildCompileCss(page, [], /* @__PURE__ */ new Set()) || "";
+		const filename = `${page.path.replace(/\//g, "_")}`;
+		if (root) {
+			const subDir = `${require_env.getTargetPath()}/${root}`;
+			if (!node_fs.default.existsSync(subDir)) node_fs.default.mkdirSync(subDir, { recursive: true });
+			node_fs.default.writeFileSync(`${subDir}/${filename}.css`, code);
+		} else {
+			const mainDir = `${require_env.getTargetPath()}/main`;
+			if (!node_fs.default.existsSync(mainDir)) node_fs.default.mkdirSync(mainDir, { recursive: true });
+			node_fs.default.writeFileSync(`${mainDir}/${filename}.css`, code);
+		}
+		progress.completedTasks++;
+	}
+}
+async function buildCompileCss(module, depthChain = [], compiledPaths = /* @__PURE__ */ new Set()) {
+	const currentPath = module.path || module.absolutePath;
+	if (depthChain.includes(currentPath)) {
+		console.warn("[style]", `检测到循环依赖: ${[...depthChain, currentPath].join(" -> ")}`);
+		return;
+	}
+	if (depthChain.length > 20) {
+		console.warn("[style]", `检测到深度依赖: ${[...depthChain, currentPath].join(" -> ")}`);
+		return;
+	}
+	if (compiledPaths.has(currentPath)) return "";
+	compiledPaths.add(currentPath);
+	depthChain = [...depthChain, currentPath];
+	let result = await enhanceCSS(module) || "";
+	if (module.usingComponents) for (const componentInfo of Object.values(module.usingComponents)) {
+		const componentModule = require_env.getComponent(componentInfo);
+		if (!componentModule) continue;
+		result += await buildCompileCss(componentModule, depthChain, compiledPaths);
+	}
+	return result;
 }
-async function buildCompileCss(module2, depthChain = []) {
-  const currentPath = module2.path;
-  if (depthChain.includes(currentPath)) {
-    console.warn("[style]", `检测到循环依赖: ${[...depthChain, currentPath].join(" -> ")}`);
-    return;
-  }
-  if (depthChain.length > 20) {
-    console.warn("[style]", `检测到深度依赖: ${[...depthChain, currentPath].join(" -> ")}`);
-    return;
-  }
-  depthChain = [...depthChain, currentPath];
-  let result = await enhanceCSS(module2) || "";
-  if (module2.usingComponents) {
-    for (const componentInfo of Object.values(module2.usingComponents)) {
-      const componentModule = env.getComponent(componentInfo);
-      if (!componentModule) {
-        continue;
-      }
-      result += await buildCompileCss(componentModule, depthChain);
-    }
-  }
-  return result;
+async function enhanceCSS(module) {
+	const absolutePath = module.absolutePath ? module.absolutePath : getAbsolutePath(module.path);
+	if (!absolutePath) return;
+	const inputCSS = require_env.getContentByPath(absolutePath);
+	if (!inputCSS) return;
+	if (compileRes.has(absolutePath)) return compileRes.get(absolutePath);
+	let processedCSS = normalizeRootStyleImports(inputCSS);
+	const ext = node_path.default.extname(absolutePath).toLowerCase();
+	try {
+		if (ext === ".less") processedCSS = (await less.default.render(processedCSS, {
+			filename: absolutePath,
+			paths: [node_path.default.dirname(absolutePath), require_env.getWorkPath()]
+		})).css;
+		else if (ext === ".scss" || ext === ".sass") processedCSS = sass.compileString(processedCSS, {
+			loadPaths: [node_path.default.dirname(absolutePath), require_env.getWorkPath()],
+			syntax: ext === ".sass" ? "indented" : "scss"
+		}).css;
+	} catch (error) {
+		console.error(`[style] 预处理器编译失败 ${absolutePath}:`, error.message);
+		processedCSS = inputCSS;
+	}
+	const fixedCSS = ensureImportSemicolons(processedCSS);
+	let ast;
+	try {
+		ast = postcss.default.parse(fixedCSS);
+	} catch (error) {
+		console.error(`[style] PostCSS 解析失败 ${absolutePath}:`, error.message);
+		return "";
+	}
+	const promises = [];
+	ast.walk(async (node) => {
+		if (node.type === "atrule" && node.name === "import") {
+			const importFullPath = resolveStyleImportPath(absolutePath, node.params.replace(/^['"]|['"]$/g, ""));
+			node.remove();
+			promises.push(buildCompileCss({
+				absolutePath: importFullPath,
+				id: module.id
+			}, [], /* @__PURE__ */ new Set()));
+		} else if (node.type === "rule") {
+			if (node.selector.includes("::v-deep")) node.selector = node.selector.replace(/::v-deep\s+(\S[^{]*)/g, ":deep($1)");
+			if (node.selector.includes(":host")) node.selector = processHostSelector(node.selector, module.id);
+			node.selector = (0, postcss_selector_parser.default)((selectors) => {
+				selectors.walkTags((tag) => {
+					if (require_env.tagWhiteList.includes(tag.value)) tag.value = `.dd-${tag.value}`;
+				});
+			}).processSync(node.selector);
+		} else if (node.type === "comment") node.remove();
+	});
+	ast.walkDecls((decl) => {
+		decl.value = normalizeCssUrlValue(decl.value, absolutePath);
+		decl.value = require_env.transformRpx(decl.value);
+	});
+	const cssCode = ast.toResult().css;
+	const moduleId = module.id;
+	const scopedCode = (0, _vue_compiler_sfc.compileStyle)({
+		source: cssCode,
+		id: moduleId,
+		scoped: !!moduleId
+	}).code;
+	const cleanedCode = await removeBaseComponentScope(scopedCode, moduleId);
+	const res = await (0, postcss.default)([(0, autoprefixer.default)({ overrideBrowserslist: ["cover 99.5%"] }), (0, cssnano.default)()]).process(cleanedCode, { from: void 0 });
+	const result = (await Promise.all(promises)).filter(Boolean).join("") + res.css;
+	compileRes.set(module.path, result);
+	return result;
 }
-async function enhanceCSS(module2) {
-  const absolutePath = module2.absolutePath ? module2.absolutePath : getAbsolutePath(module2.path);
-  if (!absolutePath) {
-    return;
-  }
-  const inputCSS = env.getContentByPath(absolutePath);
-  if (!inputCSS) {
-    return;
-  }
-  if (compileRes.has(absolutePath)) {
-    return compileRes.get(absolutePath);
-  }
-  let processedCSS = inputCSS;
-  const ext = path.extname(absolutePath).toLowerCase();
-  try {
-    if (ext === ".less") {
-      const result2 = await less.render(inputCSS, {
-        filename: absolutePath,
-        paths: [path.dirname(absolutePath)]
-      });
-      processedCSS = result2.css;
-    } else if (ext === ".scss" || ext === ".sass") {
-      const result2 = sass__namespace.compileString(inputCSS, {
-        loadPaths: [path.dirname(absolutePath)],
-        syntax: ext === ".sass" ? "indented" : "scss"
-      });
-      processedCSS = result2.css;
-    }
-  } catch (error) {
-    console.error(`[style] 预处理器编译失败 ${absolutePath}:`, error.message);
-    processedCSS = inputCSS;
-  }
-  const fixedCSS = ensureImportSemicolons(processedCSS);
-  let ast;
-  try {
-    ast = postcss.parse(fixedCSS);
-  } catch (error) {
-    console.error(`[style] PostCSS 解析失败 ${absolutePath}:`, error.message);
-    return "";
-  }
-  const promises = [];
-  ast.walk(async (node) => {
-    if (node.type === "atrule" && node.name === "import") {
-      const str = node.params.replace(/^['"]|['"]$/g, "");
-      const importFullPath = path.resolve(absolutePath, `../${str}`);
-      node.remove();
-      promises.push(buildCompileCss({ absolutePath: importFullPath, id: module2.id }));
-    } else if (node.type === "rule") {
-      if (node.selector.includes("::v-deep")) {
-        node.selector = node.selector.replace(/::v-deep\s+(\S[^{]*)/g, ":deep($1)");
-      }
-      if (node.selector.includes(":host")) {
-        node.selector = processHostSelector(node.selector, module2.id);
-      }
-      node.selector = selectorParser((selectors) => {
-        selectors.walkTags((tag) => {
-          if (env.tagWhiteList.includes(tag.value)) {
-            tag.value = `.dd-${tag.value}`;
-          }
-        });
-      }).processSync(node.selector);
-      node.walkDecls((decl) => {
-        const match = decl.value.match(/url\("([^"]*)"\)/);
-        if (match) {
-          const imgSrc = match[1].trim();
-          if (imgSrc.startsWith("data:image")) {
-            return;
-          }
-          const realSrc = env.collectAssets(env.getWorkPath(), absolutePath, imgSrc, env.getTargetPath(), env.getAppId());
-          decl.value = `url(${realSrc})`;
-        } else {
-          decl.value = env.transformRpx(decl.value);
-        }
-      });
-    } else if (node.type === "comment") {
-      node.remove();
-    }
-  });
-  const cssCode = ast.toResult().css;
-  const moduleId = module2.id;
-  const code = compilerSfc.compileStyle({
-    source: cssCode,
-    id: moduleId,
-    scoped: !!moduleId
-  }).code;
-  const res = await postcss([autoprefixer({ overrideBrowserslist: ["cover 99.5%"] }), cssnano()]).process(code, {
-    from: void 0
-    // 未指定输入源文件路径
-  });
-  const importCss = (await Promise.all(promises)).filter(Boolean).join("");
-  const result = importCss ? importCss + res.css : res.css;
-  compileRes.set(module2.path, result);
-  return result;
+function normalizeCssUrlValue(value, absolutePath) {
+	return value.replace(/url\(([^)]+)\)/g, (fullMatch, rawUrl) => {
+		const cleanedUrl = rawUrl.trim().replace(/^['"]|['"]$/g, "");
+		if (!cleanedUrl || cleanedUrl.startsWith("data:image")) return fullMatch;
+		if (cleanedUrl.startsWith("//")) return `url(https:${cleanedUrl})`;
+		if (/^(https?:|blob:|data:)/.test(cleanedUrl)) return fullMatch;
+		return `url(${require_env.collectAssets(require_env.getWorkPath(), absolutePath, cleanedUrl, require_env.getTargetPath(), require_env.getAppId())})`;
+	});
 }
 function getAbsolutePath(modulePath) {
-  const workPath = env.getWorkPath();
-  const src = modulePath.startsWith("/") ? modulePath : `/${modulePath}`;
-  for (const ssType of fileType) {
-    const ssFullPath = `${workPath}${src}${ssType}`;
-    if (fs.existsSync(ssFullPath)) {
-      return ssFullPath;
-    }
-  }
+	const workPath = require_env.getWorkPath();
+	const src = modulePath.startsWith("/") ? modulePath : `/${modulePath}`;
+	for (const ssType of fileType) {
+		const ssFullPath = `${workPath}${src}${ssType}`;
+		if (node_fs.default.existsSync(ssFullPath)) return ssFullPath;
+		const indexSsFullPath = `${workPath}${src}/index${ssType}`;
+		if (node_fs.default.existsSync(indexSsFullPath)) return indexSsFullPath;
+	}
+}
+function resolveStyleImportPath(absolutePath, importPath, workPath = require_env.getWorkPath()) {
+	if (importPath.startsWith("/")) return node_path.default.join(workPath, importPath);
+	return node_path.default.resolve(node_path.default.dirname(absolutePath), importPath);
+}
+function normalizeRootStyleImports(source, workPath = require_env.getWorkPath()) {
+	return source.replace(/(@import\s+(?:\(.*?\)\s*)?(?:url\()?['"])(\/[^'")]+)(['"]\)?)/g, (_, prefix, importPath, suffix) => {
+		return `${prefix}${node_path.default.join(workPath, importPath)}${suffix}`;
+	});
+}
+/**
+* 移除基础组件选择器的 scoped 属性
+* @param {string} css - 包含 scoped 属性的 CSS
+* @param {string} moduleId - 模块 ID
+* @returns {Promise<string>} - 清理后的 CSS
+*/
+async function removeBaseComponentScope(css, moduleId) {
+	if (!moduleId) return css;
+	const ast = postcss.default.parse(css);
+	const scopeAttrName = `data-v-${moduleId}`;
+	ast.walkRules((rule) => {
+		if (require_env.tagWhiteList.some((tag) => rule.selector.includes(`.dd-${tag}`)) && rule.selector.includes(scopeAttrName)) rule.selector = (0, postcss_selector_parser.default)((selectors) => {
+			selectors.walkAttributes((attr) => {
+				if (attr.attribute === scopeAttrName) attr.remove();
+			});
+		}).processSync(rule.selector);
+	});
+	return ast.toResult().css;
 }
+/**
+* Ensures that all @import statements in CSS end with semicolons
+* @param {string} css - The CSS content to process
+* @returns {string} - The processed CSS with semicolons added to @import statements as needed
+*/
 function ensureImportSemicolons(css) {
-  return css.replace(/@import[^;\n]*$/gm, (match) => {
-    return match.endsWith(";") ? match : `${match};`;
-  });
+	return css.replace(/@import[^;\n]*$/gm, (match) => {
+		return match.endsWith(";") ? match : `${match};`;
+	});
 }
+/**
+* 处理 :host 选择器，将其转换为适合组件根节点的选择器
+* @param {string} selector - 包含 :host 的选择器
+* @param {string} moduleId - 组件的模块ID
+* @returns {string} - 转换后的选择器
+*/
 function processHostSelector(selector, moduleId) {
-  return selector.replace(/^:host$/, `[data-v-${moduleId}]`).replace(/:host\(([^)]+)\)/g, `[data-v-${moduleId}]$1`).replace(/:host\s+/g, `[data-v-${moduleId}] `).replace(/:host(?=\.|#|:)/g, `[data-v-${moduleId}]`);
+	return selector.replace(/^:host$/, `[data-v-${moduleId}]`).replace(/:host\(([^)]+)\)/g, `[data-v-${moduleId}]$1`).replace(/:host\s+/g, `[data-v-${moduleId}] `).replace(/:host(?=\.|#|:)/g, `[data-v-${moduleId}]`);
 }
+//#endregion
 exports.compileSS = compileSS;
 exports.ensureImportSemicolons = ensureImportSemicolons;
+exports.normalizeCssUrlValue = normalizeCssUrlValue;
+exports.normalizeRootStyleImports = normalizeRootStyleImports;
 exports.processHostSelector = processHostSelector;
+exports.removeBaseComponentScope = removeBaseComponentScope;
+exports.resolveStyleImportPath = resolveStyleImportPath;