// 组件 WXSS 选择器检查(lib):供 CLI 与 UI 契约门禁共用。 // // 规则来源:微信小程序**自定义组件**的 wxss 只允许类选择器。使用标签选择器(`image`/`view`…)、 // ID 选择器(`#id`)、属性选择器(`[attr]`)时开发者工具警告: // [pages/index/index] Some selectors are not allowed in component wxss, // including tag name selectors, ID selectors, and attribute selectors. // (./components/recommend-card/index.wxss:1:1092) // // ⚠️ 作用域:**page 的 wxss 不受此限制**(页面不是组件)。 // 对 `miniapp/pages/` 套用本规则会产生误报,故只管 `miniapp/components/`。 import { readFileSync, readdirSync } from 'node:fs'; import { join } from 'node:path'; /** 去掉注释,并用等长空白占位以保持原始字符偏移(报错行号才准) */ export function stripComments(src) { return src.replace(/\/\*[\s\S]*?\*\//g, (m) => ' '.repeat(m.length)); } /** 切出所有「选择器前置文本」(`{` 之前),跳过 at-rule 与声明块内部 */ export function extractSelectorPreludes(src) { const preludes = []; let depth = 0; let buf = ''; let bufStart = 0; for (let i = 0; i < src.length; i++) { const c = src[i]; if (c === '{') { if (depth === 0) preludes.push({ text: buf, index: bufStart }); depth++; buf = ''; continue; } if (c === '}') { depth = Math.max(0, depth - 1); buf = ''; continue; } if (depth === 0) { if (buf === '') bufStart = i; buf += c; } } return preludes; } /** * 检查一段选择器前置文本是否含违规成分。 * @returns {string[]} 违规描述(去重) */ export function findViolations(selector) { const bad = []; const s = selector.trim(); if (!s) return bad; if (s.startsWith('@')) return bad; // @media / @keyframes / @import 不是选择器 // 去掉伪类/伪元素及其函数括号内容,避免把 `:nth-child(2)` 里的标识符当标签 const cleaned = s.replace(/:{1,2}[a-zA-Z-]+(\([^)]*\))?/g, '').replace(/\([^)]*\)/g, ''); for (const part of cleaned.split(',')) { const token = part.trim(); if (!token) continue; const idMatch = token.match(/#[A-Za-z_][\w-]*/); if (idMatch) bad.push(`ID 选择器 \`${idMatch[0]}\``); const attrMatch = token.match(/\[[^\]]*\]/); if (attrMatch) bad.push(`属性选择器 \`${attrMatch[0]}\``); // 标签选择器:`>`/空格/`+`/`~` 之后紧跟的裸元素名 const tagMatch = token.match(/(^|[\s>+~])([a-zA-Z][\w-]*)/); if (tagMatch) bad.push(`标签选择器 \`${tagMatch[2]}\``); } return [...new Set(bad)]; } /** * 检查单个 wxss 文件内容。 * @returns {{line:number, message:string}[]} */ export function checkWxss(src) { const clean = stripComments(src); const out = []; for (const { text, index } of extractSelectorPreludes(clean)) { for (const v of findViolations(text)) { out.push({ line: clean.slice(0, index).split('\n').length, message: `${v}(选择器原文 \`${text.trim().slice(0, 60)}\`)`, }); } } return out; } export function walkWxss(dir, out = []) { let entries; try { entries = readdirSync(dir, { withFileTypes: true }); } catch { return out; } for (const e of entries) { const p = join(dir, e.name); if (e.isDirectory()) { if (!['node_modules', 'miniprogram_npm'].includes(e.name)) walkWxss(p, out); } else if (e.name.endsWith('.wxss')) { out.push(p); } } return out; } export { readFileSync };