@agile-team/wl-skills-ui 1.8.0 → 1.8.2

package/CHANGELOG.md

@@ -4,6 +4,28 @@ All notable changes to **@agile-team/wl-skills-ui** will be documented in this f
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 
+## [1.8.2] - 2026-05-13
+
+### Fixed
+
+- **搜索区字号不一致**：`_base-query-toolbar.scss` 统一 label / input / select / placeholder 为 **12px**，消除 13px→12px 混杂导致的视觉跳动。
+- **必填星号重复 `* *`**：`_base-components.scss` 必填星号改为精确模式——默认只显示 `::before`，`asterisk-right` 仅显示 `::after`，避免 `display: inline-block !important` 同时作用于两个伪元素。`_jh-ui.scss` 同步精简为只声明颜色不控制 `display`。
+
+### Added
+
+- **scanner fixture 测试集**：`scanner/__tests__/` 覆盖 R001/R002/R006/R011/R016/R021 + drift 模块共 16 条自动化测试，`npm test` 一键跑。
+- **SCSS 链路检查**：`scripts/check-scss.mjs` 递归验证 `styles/index.scss` 和 `presets/skin.scss` 的 `@forward/@use` 链路完整性。
+- **scan --baseline 一步到位**：`wl-scan scan --target src --baseline .wl-baseline.json` 扫描后自动对比基线输出漂移报告，`--fail-on-error` 同时拦截新增违规。
+- `package.json` 新增 `test` 和 `check:scss` 脚本。
+
+## [1.8.1] - 2026-05-13
+
+### Added
+
+- 新增 **`scanner/drift.mjs`** 漂移检测模块：对比基线与当前扫描 JSON，输出 gained / fixed / regressed 结构化报告。
+- 新增 CLI `wl-scan drift --baseline <f> --current <f>` 子命令，支持 `--output json` 和 `--fail-on-error` 门槛。
+- 新增 MCP 工具 **`wl_ui_drift`**：AI 可直接传入两份扫描 JSON 拿漂移报告。
+
 ## [1.8.0] - 2026-05-12
 
 ### Added

package/README.md

@@ -213,14 +213,14 @@ yarn add @agile-team/wl-skills-ui
 
 ## 版本亮点
 
-当前 v1.8.0 版本完成 R-rule 治理体系单一事实源化，并落地业务项目长效治理方案：
-
-- 新增 **`standards/rules.json`** 作为 29 条 R-rule 的单一事实源；所有 standards 文档、SKILL.md、scanner、MCP、未来 ESLint 插件均从此派生
-- 新增 **`standards/rules-loader.mjs`** 共享加载器；新增 MCP 工具 **`wl_ui_list_rules`** / **`wl_ui_describe_rule`**，AI 写代码前一键查规则
-- 修复历史 ID 冲突与逻辑反转 bug：scanner `tag.mjs` 原 R017/R018 重号为 R019/R020（与 `color.mjs` 解耦，旧 ID 通过 `aliases` 兼容）；R011 由"必须放 #footer"反转为"不得放 #footer"，与 standards/ui/05 对齐
-- 清理 `_registry.md` 12 条幽灵 skill 引用；`runtime/style-align/SKILL.md` 改为指针式引用 rules.json，不再复述规则细节
-- `scripts/check-docs.mjs` 扩展为 R-rule / scanner / SKILL / registry 四向一致性守卫，CI 不一致直接红灯
-- 新增 **`docs/governance-long-term.md`**：业务项目长效治理方案（基线 / 豁免 / 漂移看板 / 版本钉死 / 写作期 AI 守护五机制），杜绝遗留累积与升级回归
+当前 v1.8.2：
+
+- **修复**搜索区字号 13px/12px 混杂 → 统一 12px；必填星号 `* *` 重复 → 精确单颗控制
+- 新增 **scanner fixture 测试集**（16 条自动化测试，`npm test`）和 **SCSS 链路检查**（`npm run check:scss`）
+- `scan --baseline` 一步到位：扫描后自动对比基线输出漂移报告，CI 增量门槛
+- **漂移检测** `scanner/drift.mjs` + CLI `wl-scan drift` + MCP `wl_ui_drift`
+- **R-rule 单一事实源** `standards/rules.json`（29 条），五向一致性守卫
+- **长效治理方案** `docs/governance-long-term.md`（基线 / 豁免 / 漂移 / 版本钉死 / AI 守护）
 
 历史亮点（v1.7.1）：
 

package/docs/governance-long-term.md

@@ -78,24 +78,37 @@ npx wl-ui scan --target src --baseline .wl-baseline.json --fail-on=new-issues
 **目标**：让"逐渐变烂"可见，每次升级都能量化。
 
 ```bash
-# 每次 wl-skills-ui 升版后跑一次
-npx wl-ui audit --target src --output json --outFile .wl-drift-after.json
-node -e "console.log(require('@agile-team/wl-skills-ui/scanner/drift.mjs').report('.wl-baseline.json','.wl-drift-after.json'))"
+# 方式一：scan 一步到位（v1.8.2+）
+npx wl-ui scan --target src --baseline .wl-baseline.json --fail-on-error
+
+# 方式二：独立 drift 子命令
+npx wl-ui scan --target src --output json --outFile .wl-current.json
+npx wl-ui drift --baseline .wl-baseline.json --current .wl-current.json
 ```
 
-输出（示意）：
+输出示例：
 
 ```
-变化（基线 → 当前）
-  gained   +12  新增违规（红灯）
-  fixed    -45  消化历史（绿灯）
-  regressed +3  曾修过又破的（黄灯，最高优先级追查）
-  exempt    +0  豁免清单未扩张
-按规则 Top3：R017(+8) R001(+3) R009(+1)
-按目录 Top3：src/views/quote(+9) src/views/cost(+3)
+╭──────────────────────────────────────╮
+│        wl-skills-ui 漂移报告         │
+╰──────────────────────────────────────╯
+
+基线违规: 120  →  当前违规: 87  (-33)
+
+  🔴 gained   +3  新增违规
+  🟢 fixed    -36  消化历史
+
+新增 Top 规则:
+  R017  +2
+  R001  +1
+
+消化 Top 规则:
+  R009  -15
+  R004  -12
+  R016  -9
 ```
 
-> 实现入口：v1.8.0 起 `scanner/index.mjs` 已暴露 `--output json` 完整结构（含 `file/line/rule`），业务项目可基于该结构自实现 drift 报告；包内 `scanner/drift.mjs` 在 1.8.x 后续小版本提供。
+> 实现入口：`scanner/drift.mjs` 提供 `drift()` / `driftFromFiles()` / `formatDriftText()` / `formatDriftJson()` 四个 API。MCP 工具 `wl_ui_drift` 可供 AI 直接调用。
 
 ---
 

package/mcp/server.js

@@ -133,6 +133,25 @@ const TOOLS = [
       required: ["id"],
     },
   },
+  {
+    name: "wl_ui_drift",
+    description:
+      "对比基线与当前扫描 JSON，输出漂移报告（gained / fixed / regressed）。用于 PR 级增量门槛。",
+    inputSchema: {
+      type: "object",
+      properties: {
+        baselineJson: {
+          type: "string",
+          description: "基线扫描 JSON 字符串（.wl-baseline.json 的内容）",
+        },
+        currentJson: {
+          type: "string",
+          description: "当前扫描 JSON 字符串",
+        },
+      },
+      required: ["baselineJson", "currentJson"],
+    },
+  },
   {
     name: "wl_ui_recommend_flow",
     description:
@@ -495,6 +514,31 @@ async function dispatchTool(id, name, args) {
       });
       return;
     }
+    if (name === "wl_ui_drift") {
+      const { drift, formatDriftJson } = await import("../scanner/drift.mjs");
+      try {
+        const baseline = JSON.parse(args.baselineJson);
+        const current = JSON.parse(args.currentJson);
+        const result = drift(baseline, current);
+        sendResult(id, {
+          content: [{ type: "text", text: formatDriftJson(result) }],
+        });
+      } catch (e) {
+        sendResult(id, {
+          content: [
+            {
+              type: "text",
+              text: JSON.stringify(
+                { ok: false, reason: String(e.message) },
+                null,
+                2,
+              ),
+            },
+          ],
+        });
+      }
+      return;
+    }
     if (name === "wl_ui_recommend_flow") {
       sendResult(id, {
         content: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agile-team/wl-skills-ui",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "description": "企业级 UI 风格对齐框架 — Vue + Element Plus 项目通用化妆/原生双模式（tokens / element / vendors / layouts / runtime / scanner / fixer / skills）",
   "type": "module",
   "main": "./es/index.js",
@@ -41,6 +41,8 @@
     "build": "tsup && npm run sync:tokens",
     "prepare": "npm run build",
     "sync:tokens": "node -e \"import('fs').then(fs=>fs.copyFileSync('design/tokens/base.css','dist/tokens.css'))\"",
+    "test": "node --test scanner/__tests__/scan.test.mjs",
+    "check:scss": "node scripts/check-scss.mjs",
     "docs:check": "node scripts/check-docs.mjs",
     "scan": "node scanner/index.mjs scan",
     "check": "node scanner/index.mjs check",

package/scanner/__tests__/fixtures/r001-fail.vue

@@ -0,0 +1,7 @@
+<template>
+  <el-table :data="list">
+    <el-table-column type="selection" width="55" />
+    <el-table-column prop="name" label="名称" />
+    <el-table-column prop="status" label="状态" align="left" />
+  </el-table>
+</template>

package/scanner/__tests__/fixtures/r001-pass.vue

@@ -0,0 +1,7 @@
+<template>
+  <el-table :data="list" empty-text="暂无数据">
+    <el-table-column type="selection" align="center" header-align="center" width="55" />
+    <el-table-column prop="name" label="名称" align="center" />
+    <el-table-column prop="status" label="状态" align="center" />
+  </el-table>
+</template>

package/scanner/__tests__/fixtures/r002-fail.vue

@@ -0,0 +1,5 @@
+<template>
+  <el-table :data="list">
+    <el-table-column prop="name" label="名称" align="center" />
+  </el-table>
+</template>

package/scanner/__tests__/fixtures/r002-pass.vue

@@ -0,0 +1,5 @@
+<template>
+  <el-table :data="list" empty-text="暂无数据">
+    <el-table-column prop="name" label="名称" align="center" />
+  </el-table>
+</template>

package/scanner/__tests__/fixtures/r006-fail.vue

@@ -0,0 +1,10 @@
+<template>
+  <el-form>
+    <el-form-item label="名称">
+      <el-input v-model="form.name" />
+    </el-form-item>
+    <el-form-item label="类型">
+      <el-select v-model="form.type" />
+    </el-form-item>
+  </el-form>
+</template>

package/scanner/__tests__/fixtures/r006-pass.vue

@@ -0,0 +1,10 @@
+<template>
+  <el-form>
+    <el-form-item label="名称">
+      <el-input v-model="form.name" size="small" />
+    </el-form-item>
+    <el-form-item label="类型">
+      <el-select v-model="form.type" size="small" />
+    </el-form-item>
+  </el-form>
+</template>

package/scanner/__tests__/fixtures/r011-fail.vue

@@ -0,0 +1,11 @@
+<template>
+  <el-dialog v-model="visible" title="列表">
+    <el-table :data="list">
+      <el-table-column prop="name" label="名称" align="center" />
+    </el-table>
+    <template #footer>
+      <el-pagination :total="total" />
+      <el-button @click="visible = false">取消</el-button>
+    </template>
+  </el-dialog>
+</template>

package/scanner/__tests__/fixtures/r011-pass.vue

@@ -0,0 +1,14 @@
+<template>
+  <el-dialog v-model="visible" title="列表">
+    <el-table :data="list">
+      <el-table-column prop="name" label="名称" align="center" />
+    </el-table>
+    <div class="popup-pagination">
+      <el-pagination :total="total" />
+    </div>
+    <template #footer>
+      <el-button @click="visible = false">取消</el-button>
+      <el-button type="primary" @click="save">确定</el-button>
+    </template>
+  </el-dialog>
+</template>

package/scanner/__tests__/fixtures/r016-fail.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="box">hello</div>
+</template>
+<style scoped>
+.box {
+  color: #409eff;
+  background-color: #f56c6c;
+}
+</style>

package/scanner/__tests__/fixtures/r016-pass.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="box">hello</div>
+</template>
+<style scoped>
+.box {
+  color: var(--el-color-primary);
+  background-color: var(--el-fill-color-light);
+}
+</style>

package/scanner/__tests__/fixtures/r021-fail.vue

@@ -0,0 +1,3 @@
+<template>
+  <BaseTable :data="list" cid="test-table" empty-text="暂无数据" />
+</template>

package/scanner/__tests__/fixtures/r021-pass.vue

@@ -0,0 +1,3 @@
+<template>
+  <BaseTable :data="list" render-type="agGrid" cid="test-table" empty-text="暂无数据" />
+</template>

package/scanner/__tests__/scan.test.mjs

@@ -0,0 +1,145 @@
+/**
+ * scanner/__tests__/scan.test.mjs — scanner 规则 fixture 测试
+ *
+ * 用法：node --test scanner/__tests__/scan.test.mjs
+ *
+ * 约定：fixtures/<ruleId>-pass.vue → 0 violations of that rule
+ *       fixtures/<ruleId>-fail.vue → ≥1 violations of that rule
+ *
+ * 每条测试只断言对应 rule 的命中数，不受其他规则干扰。
+ */
+import { describe, it } from "node:test";
+import assert from "node:assert/strict";
+import { readFileSync, readdirSync } from "node:fs";
+import { join, dirname } from "node:path";
+import { fileURLToPath } from "node:url";
+import { getRules } from "../rules/index.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const FIXTURES = join(__dirname, "fixtures");
+const rules = getRules();
+
+/**
+ * 简易单文件扫描：跑所有规则，返回 issues 数组
+ */
+function scanFixture(filename) {
+  const content = readFileSync(join(FIXTURES, filename), "utf8");
+  const issues = [];
+
+  // extract template
+  const tmplMatch = content.match(/(<template[^>]*>)([\s\S]*?)(<\/template>)/);
+  const template = tmplMatch ? tmplMatch[0] : content;
+  const tmplOffset = tmplMatch
+    ? content.slice(0, content.indexOf(tmplMatch[0])).split("\n").length - 1
+    : 0;
+
+  // extract style
+  const styleMatch = content.match(/<style[^>]*>([\s\S]*?)<\/style>/);
+  const styleBlock = styleMatch ? styleMatch[1] : null;
+  const styleOffset = styleMatch
+    ? content.slice(0, content.indexOf(styleMatch[0])).split("\n").length
+    : 0;
+
+  // extract script
+  const scriptMatch = content.match(/<script[^>]*>([\s\S]*?)<\/script>/);
+  const scriptBlock = scriptMatch ? scriptMatch[1] : null;
+  const scriptOffset = scriptMatch
+    ? content.slice(0, content.indexOf(scriptMatch[0])).split("\n").length
+    : 0;
+
+  for (const rule of rules) {
+    if (typeof rule.check === "function") {
+      issues.push(...rule.check(template, filename, tmplOffset));
+    }
+    if (styleBlock && typeof rule.checkStyle === "function") {
+      issues.push(...rule.checkStyle(styleBlock, filename, styleOffset));
+    }
+    if (scriptBlock && typeof rule.checkScript === "function") {
+      issues.push(...rule.checkScript(scriptBlock, filename, scriptOffset));
+    }
+  }
+  return issues;
+}
+
+// ── 自动发现 fixtures 并生成测试 ────────────────────────────────────────────
+const fixtureFiles = readdirSync(FIXTURES).filter((f) => f.endsWith(".vue"));
+const grouped = new Map(); // ruleId → { pass: [], fail: [] }
+
+for (const f of fixtureFiles) {
+  const m = f.match(/^(r\d+)-(pass|fail)\.vue$/i);
+  if (!m) continue;
+  const ruleId = m[1].toUpperCase();
+  const kind = m[2]; // pass | fail
+  if (!grouped.has(ruleId)) grouped.set(ruleId, { pass: [], fail: [] });
+  grouped.get(ruleId)[kind].push(f);
+}
+
+for (const [ruleId, { pass, fail }] of grouped) {
+  describe(ruleId, () => {
+    for (const f of pass) {
+      it(`${f} → 0 violations`, () => {
+        const issues = scanFixture(f).filter((i) => i.rule === ruleId);
+        assert.equal(
+          issues.length,
+          0,
+          `Expected 0 ${ruleId} issues but got ${issues.length}: ${JSON.stringify(issues, null, 2)}`,
+        );
+      });
+    }
+    for (const f of fail) {
+      it(`${f} → ≥1 violations`, () => {
+        const issues = scanFixture(f).filter((i) => i.rule === ruleId);
+        assert.ok(issues.length > 0, `Expected ≥1 ${ruleId} issues but got 0`);
+      });
+    }
+  });
+}
+
+// ── drift 模块测试 ──────────────────────────────────────────────────────────
+const { drift } = await import("../drift.mjs");
+
+describe("drift", () => {
+  it("identical → 0 gained, 0 fixed", () => {
+    const data = { issues: [{ file: "a.vue", rule: "R001" }] };
+    const r = drift(data, data);
+    assert.equal(r.gained.count, 0);
+    assert.equal(r.fixed.count, 0);
+    assert.equal(r.netDelta, 0);
+  });
+
+  it("new issues → gained > 0", () => {
+    const base = { issues: [] };
+    const cur = { issues: [{ file: "a.vue", rule: "R001" }] };
+    const r = drift(base, cur);
+    assert.equal(r.gained.count, 1);
+    assert.equal(r.fixed.count, 0);
+  });
+
+  it("removed issues → fixed > 0", () => {
+    const base = { issues: [{ file: "a.vue", rule: "R001" }] };
+    const cur = { issues: [] };
+    const r = drift(base, cur);
+    assert.equal(r.gained.count, 0);
+    assert.equal(r.fixed.count, 1);
+  });
+
+  it("mixed → both gained and fixed", () => {
+    const base = {
+      issues: [
+        { file: "a.vue", rule: "R001" },
+        { file: "a.vue", rule: "R001" },
+        { file: "b.vue", rule: "R016" },
+      ],
+    };
+    const cur = {
+      issues: [
+        { file: "a.vue", rule: "R001" },
+        { file: "c.vue", rule: "R017" },
+        { file: "c.vue", rule: "R017" },
+      ],
+    };
+    const r = drift(base, cur);
+    assert.equal(r.gained.count, 2); // c.vue R017 ×2
+    assert.equal(r.fixed.count, 2); // a.vue R001 ×1 + b.vue R016 ×1
+  });
+});

package/scanner/drift.mjs

@@ -0,0 +1,179 @@
+/**
+ * scanner/drift.mjs — 漂移检测
+ *
+ * 对比 baseline（基线 JSON）与 current（当前扫描 JSON），输出结构化漂移报告。
+ * 指纹策略：file + rule（行号不稳定，不参与指纹）。同一 file+rule 多条则按数量 diff。
+ *
+ * 用法：
+ *   import { drift, formatDriftText } from '@agile-team/wl-skills-ui/scanner/drift.mjs'
+ *   const result = drift(baselineJson, currentJson)
+ *   console.log(formatDriftText(result))
+ *
+ * CLI（由 scanner/index.mjs 调用）：
+ *   npx wl-ui drift --baseline .wl-baseline.json --current .wl-current.json
+ *
+ * 事实源：standards/rules.json
+ */
+import { readFileSync, existsSync } from "node:fs";
+
+// ── 指纹 ────────────────────────────────────────────────────────────────────
+
+function fingerprint(issue) {
+  return `${issue.file}\x00${issue.rule}`;
+}
+
+function buildCountMap(issues) {
+  const map = new Map();
+  for (const iss of issues) {
+    const key = fingerprint(iss);
+    map.set(key, (map.get(key) || 0) + 1);
+  }
+  return map;
+}
+
+// ── 核心 diff ───────────────────────────────────────────────────────────────
+
+/**
+ * @param {object} baseline  JSON 扫描结果（含 issues 数组）
+ * @param {object} current   JSON 扫描结果（含 issues 数组）
+ * @returns {DriftResult}
+ */
+export function drift(baseline, current) {
+  const baseIssues = baseline.issues || [];
+  const curIssues = current.issues || [];
+  const baseMap = buildCountMap(baseIssues);
+  const curMap = buildCountMap(curIssues);
+
+  const allKeys = new Set([...baseMap.keys(), ...curMap.keys()]);
+
+  const gained = []; // 新增（当前有、基线无 或 当前 > 基线）
+  const fixed = []; // 消化（基线有、当前无 或 当前 < 基线）
+  const regressed = []; // 回归预留（后续可扩展 fix-then-break 检测）
+
+  for (const key of allKeys) {
+    const [file, rule] = key.split("\x00");
+    const baseCount = baseMap.get(key) || 0;
+    const curCount = curMap.get(key) || 0;
+    const delta = curCount - baseCount;
+    if (delta > 0) {
+      gained.push({ file, rule, delta, baseCount, curCount });
+    } else if (delta < 0) {
+      fixed.push({ file, rule, delta, baseCount, curCount });
+    }
+    // delta === 0 → 无变化，跳过
+  }
+
+  // 按规则 & 目录 聚合
+  const byRule = aggregate(gained, "rule");
+  const byDir = aggregateDir(gained);
+  const fixedByRule = aggregate(fixed, "rule");
+
+  return {
+    baselineTotal: baseIssues.length,
+    currentTotal: curIssues.length,
+    netDelta: curIssues.length - baseIssues.length,
+    gained: { count: sumDelta(gained), items: gained },
+    fixed: { count: Math.abs(sumDelta(fixed)), items: fixed },
+    regressed: { count: 0, items: regressed },
+    topGainedByRule: sortDesc(byRule).slice(0, 5),
+    topGainedByDir: sortDesc(byDir).slice(0, 5),
+    topFixedByRule: sortDesc(fixedByRule).slice(0, 5),
+  };
+}
+
+function sumDelta(arr) {
+  return arr.reduce((s, i) => s + Math.abs(i.delta), 0);
+}
+
+function aggregate(items, field) {
+  const map = new Map();
+  for (const it of items) {
+    const key = it[field];
+    map.set(key, (map.get(key) || 0) + Math.abs(it.delta));
+  }
+  return [...map.entries()].map(([key, count]) => ({ key, count }));
+}
+
+function aggregateDir(items) {
+  const map = new Map();
+  for (const it of items) {
+    const parts = it.file.split("/");
+    const dir = parts.length > 1 ? parts.slice(0, -1).join("/") : ".";
+    map.set(dir, (map.get(dir) || 0) + Math.abs(it.delta));
+  }
+  return [...map.entries()].map(([key, count]) => ({ key, count }));
+}
+
+function sortDesc(arr) {
+  return arr.sort((a, b) => b.count - a.count);
+}
+
+// ── 文本格式化 ──────────────────────────────────────────────────────────────
+
+export function formatDriftText(result) {
+  const lines = [];
+  lines.push("╭──────────────────────────────────────╮");
+  lines.push("│        wl-skills-ui 漂移报告         │");
+  lines.push("╰──────────────────────────────────────╯");
+  lines.push("");
+  lines.push(`基线违规: ${result.baselineTotal}  →  当前违规: ${result.currentTotal}  (${result.netDelta >= 0 ? "+" : ""}${result.netDelta})`);
+  lines.push("");
+  lines.push(`  🔴 gained   +${result.gained.count}  新增违规`);
+  lines.push(`  🟢 fixed    -${result.fixed.count}  消化历史`);
+  if (result.regressed.count > 0) {
+    lines.push(`  🟡 regressed +${result.regressed.count}  回归`);
+  }
+  lines.push("");
+
+  if (result.topGainedByRule.length > 0) {
+    lines.push("新增 Top 规则:");
+    for (const { key, count } of result.topGainedByRule) {
+      lines.push(`  ${key}  +${count}`);
+    }
+    lines.push("");
+  }
+
+  if (result.topGainedByDir.length > 0) {
+    lines.push("新增 Top 目录:");
+    for (const { key, count } of result.topGainedByDir) {
+      lines.push(`  ${key}  +${count}`);
+    }
+    lines.push("");
+  }
+
+  if (result.topFixedByRule.length > 0) {
+    lines.push("消化 Top 规则:");
+    for (const { key, count } of result.topFixedByRule) {
+      lines.push(`  ${key}  -${count}`);
+    }
+    lines.push("");
+  }
+
+  return lines.join("\n");
+}
+
+// ── JSON 格式化 ─────────────────────────────────────────────────────────────
+
+export function formatDriftJson(result) {
+  return JSON.stringify(result, null, 2);
+}
+
+// ── 文件级便捷 API ──────────────────────────────────────────────────────────
+
+/**
+ * 从两个 JSON 文件路径生成漂移报告
+ * @param {string} baselinePath
+ * @param {string} currentPath
+ * @returns {DriftResult}
+ */
+export function driftFromFiles(baselinePath, currentPath) {
+  if (!existsSync(baselinePath)) {
+    throw new Error(`基线文件不存在: ${baselinePath}`);
+  }
+  if (!existsSync(currentPath)) {
+    throw new Error(`当前扫描结果不存在: ${currentPath}`);
+  }
+  const baseline = JSON.parse(readFileSync(baselinePath, "utf8"));
+  const current = JSON.parse(readFileSync(currentPath, "utf8"));
+  return drift(baseline, current);
+}

package/scanner/index.mjs

@@ -11,6 +11,7 @@
  *   wl-scan fix --target <path> --dry-run
  *   wl-scan all --project <path>          # 接入检查 + 风格扫描 + 报告
  *   wl-scan init                          # 打印接入指引
+ *   wl-scan drift --baseline <f> --current <f>  # 漂移检测
  *   wl-scan snapshot list                  # 列出快照
  *   wl-scan snapshot rollback [--id <id>]  # 回退到快照（默认最新）
  *   wl-scan snapshot diff [--id <id>]      # 查看快照与当前差异
@@ -43,6 +44,7 @@ const SUBCOMMANDS = new Set([
   "fix",
   "all",
   "init",
+  "drift",
   "snapshot",
 ]);
 let subcommand = "scan";
@@ -67,6 +69,8 @@ const { values } = parseArgs({
     keep: { type: "string", default: "5" },
     "no-snapshot": { type: "boolean", default: false },
     exempt: { type: "string", default: "" },
+    baseline: { type: "string", default: "" },
+    current: { type: "string", default: "" },
   },
   strict: false,
 });
@@ -263,6 +267,27 @@ if (subcommand === "check") {
   process.exit(values["fail-on-error"] && hasError ? 1 : 0);
 }
 
+if (subcommand === "drift") {
+  const { driftFromFiles, formatDriftText, formatDriftJson } =
+    await import("./drift.mjs");
+  const baselinePath = resolve(values.baseline || ".wl-baseline.json");
+  const currentPath = resolve(values.current);
+  if (!values.current) {
+    console.error(
+      "用法: wl-scan drift --baseline .wl-baseline.json --current .wl-current.json",
+    );
+    process.exit(1);
+  }
+  const result = driftFromFiles(baselinePath, currentPath);
+  if (values.output === "json") {
+    console.log(formatDriftJson(result));
+  } else {
+    console.log(formatDriftText(result));
+  }
+  const hasNew = result.gained.count > 0;
+  process.exit(values["fail-on-error"] && hasNew ? 1 : 0);
+}
+
 if (subcommand === "snapshot") {
   const projectRoot = resolve(values.project);
   const sub = args[0] || "list";
@@ -398,6 +423,30 @@ if (subcommand === "all") {
   } else {
     console.log(report);
   }
+
+  // ── baseline 漂移检测（--baseline <file>）────────────────────────────────
+  let driftResult = null;
+  if (values.baseline) {
+    const { existsSync: fileExists } = await import("node:fs");
+    const baselinePath = resolve(values.baseline);
+    if (fileExists(baselinePath)) {
+      const { drift, formatDriftText, formatDriftJson } =
+        await import("./drift.mjs");
+      const baseline = JSON.parse(readFileSync(baselinePath, "utf8"));
+      const currentData = { issues: filtered };
+      driftResult = drift(baseline, currentData);
+      console.error("");
+      if (values.output === "json") {
+        console.error(formatDriftJson(driftResult));
+      } else {
+        console.error(formatDriftText(driftResult));
+      }
+    } else {
+      console.error(`[wl-scan] 基线文件不存在: ${baselinePath}，跳过漂移检测`);
+    }
+  }
+
   const hasError = filtered.some((i) => i.severity === "error");
-  process.exit(values["fail-on-error"] && hasError ? 1 : 0);
+  const hasDriftNew = driftResult && driftResult.gained.count > 0;
+  process.exit(values["fail-on-error"] && (hasError || hasDriftNew) ? 1 : 0);
 }

package/scripts/check-scss.mjs

@@ -0,0 +1,99 @@
+#!/usr/bin/env node
+/**
+ * scripts/check-scss.mjs — SCSS 链路完整性检查
+ *
+ * 递归验证 styles/index.scss 的 @forward/@use 链，
+ * 确保所有被引入的 SCSS partial 文件真实存在。
+ * 跳过 sass: 内置模块和包自引用（@agile-team/... / wl-skills-ui/...）。
+ *
+ * 用法：npm run check:scss
+ */
+import { readFileSync, existsSync } from "node:fs";
+import { join, dirname, resolve, basename } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const ROOT = resolve(__dirname, "..");
+const STYLES = join(ROOT, "styles");
+
+let errors = 0;
+
+/** 跳过包自引用和 sass 内置 */
+function shouldSkip(ref) {
+  if (ref.startsWith("sass:")) return true;
+  if (ref.startsWith("~")) return true;
+  if (ref.startsWith("@agile-team/")) return true;
+  if (ref.startsWith("wl-skills-ui/")) return true;
+  return false;
+}
+
+/** 解析 SCSS @forward/@use 引用到实际文件路径 */
+function resolveScssRef(dir, ref) {
+  // 已有 .scss 后缀
+  if (ref.endsWith(".scss")) {
+    const direct = join(dir, ref);
+    if (existsSync(direct)) return direct;
+    // _partial
+    const partial = join(dirname(direct), "_" + basename(direct));
+    if (existsSync(partial)) return partial;
+    return null;
+  }
+  // 无后缀：SCSS partial 解析规则
+  const name = basename(ref);
+  const refDir = dirname(ref);
+  const base = join(dir, refDir);
+  const candidates = [
+    join(base, name + ".scss"),
+    join(base, "_" + name + ".scss"),
+    join(base, name, "index.scss"),
+    join(base, name, "_index.scss"),
+  ];
+  return candidates.find((c) => existsSync(c)) || null;
+}
+
+function checkImportChain(filePath, visited = new Set()) {
+  const norm = resolve(filePath);
+  if (visited.has(norm)) return;
+  visited.add(norm);
+  if (!existsSync(norm)) {
+    console.error(`❌ 文件不存在: ${norm}`);
+    errors++;
+    return;
+  }
+  const content = readFileSync(norm, "utf8");
+  const re = /@(?:forward|use|import)\s+['"]([^'"]+)['"]/g;
+  let m;
+  while ((m = re.exec(content)) !== null) {
+    const ref = m[1];
+    if (shouldSkip(ref)) continue;
+    const resolved = resolveScssRef(dirname(norm), ref);
+    if (!resolved) {
+      console.error(`❌ ${norm} → "${ref}" 无法解析`);
+      errors++;
+    } else {
+      checkImportChain(resolved, visited);
+    }
+  }
+}
+
+// 入口
+const entryPoints = [
+  join(STYLES, "index.scss"),
+  join(STYLES, "presets", "skin.scss"),
+];
+
+for (const entry of entryPoints) {
+  if (!existsSync(entry)) {
+    console.error(`❌ 入口文件不存在: ${entry}`);
+    errors++;
+    continue;
+  }
+  checkImportChain(entry);
+}
+
+if (errors > 0) {
+  console.error(`\n❌ SCSS 链路检查失败: ${errors} 个错误`);
+  process.exit(1);
+} else {
+  console.log("✅ SCSS 链路检查通过");
+}

package/styles/vendors/_base-components.scss

@@ -508,13 +508,26 @@
   word-break: keep-all;
 }
 
-.el-form-item.is-required:not(.is-no-asterisk).asterisk-left > .el-form-item__label::before,
-.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label::after,
-.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::before,
-.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::after {
+// 必填星号：只保留一颗 — 默认 asterisk-left（::before），asterisk-right 用 ::after
+// 旧写法同时 display:inline-block 两个伪元素导致 * * 重复
+.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::before {
   color: var(--el-color-danger, #f56c6c) !important;
   display: inline-block !important;
 }
+// asterisk-right 模式：显示 ::after，隐藏 ::before
+.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label::before {
+  display: none !important;
+}
+
+.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label::after {
+  color: var(--el-color-danger, #f56c6c) !important;
+  display: inline-block !important;
+}
+
+// 默认模式：隐藏 ::after 防止重复星号
+.el-form-item.is-required:not(.is-no-asterisk):not(.asterisk-right)>.el-form-item__label::after {
+  display: none !important;
+}
 
 .el-form-item.is-error {
   .el-form-item__label,

package/styles/vendors/_base-query-toolbar.scss

@@ -33,12 +33,21 @@
     }
   }
 
+    // ── 搜索区字号统一 12px（紧凑密度，与 label / button 一致）────────────────
+    .el-form-item__label {
+      font-size: 12px !important;
+    }
   .el-input__inner {
-    font-size: 13px;
+    font-size: 12px;
     color: var(--el-text-color-primary);
     &::placeholder { color: var(--el-text-color-placeholder); font-size: 12px; }
   }
 
+    .el-select__placeholder,
+    .el-select__tags-text,
+    .el-select .el-select__selected-item {
+      font-size: 12px;
+    }
   // ── 选择框 ────────────────────────────────────────────────────────────────
   .el-select .el-select__wrapper {
     border-radius: 6px !important;

package/styles/vendors/_jh-ui.scss

@@ -91,12 +91,9 @@
 }
 
 // 6) 必填星号兼容 jh-ui label 结构
-//    Element Plus 把 `::before` 放在 `.el-form-item__label` 上，
-//    jh-ui 没改这一点；但 label 自身是 inline-flex，部分浏览器下
-//    `::before` 会作为 flex 项参与排版，必须显式声明颜色/显示。
+//    颜色统一 danger 色；显示/隐藏由 _base-components.scss 总控，
+//    此处只负责颜色，不设 display，避免与总控冲突导致 * * 重复。
 .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before,
-.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::after,
-.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label > .com-text::before,
-.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label > .com-text::after {
+.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label>.com-text::before {
   color: var(--el-color-danger, #f56c6c) !important;
 }