#!/usr/bin/env node
/**
* check-ds.mjs — 真相源自检闸(扫 design/ 自身,零依赖,Node >= 18)
*
* 七道检查(违规 exit 1,逐条打印文件:行):
* ① tokens dark 键 ⊆ light 键(防孤儿 dark token)
* ② token 值内 var(--x) 引用链可解析;styles.css @import 的文件存在
* ③ design/ 内(guidelines/components/ui_kits/index.html/styles.css)裸色
* 必须 ∈ tokens 值集,或行内带 `ds-ignore:` 豁免注释
* ④ components/**\/*.jsx 导出的组件必须在登记簿 design/index.html 出现
* ⑤ icons.js:key 唯一、path 为描边风格(禁 fill="#...")
* ⑥ icon-map.json:web 列 ↔ icons.js key 双向同集;值为 string|null
* ⑦ 组件/ui_kits 界面文案禁 emoji(键帽符号 ⌘⇧⌫↵⌥ 不在 emoji 区,天然放行)
*
* 用法:node design-pipeline/check-ds.mjs
*/
import { readFileSync, readdirSync, existsSync, statSync } from 'node:fs';
import { resolve, dirname, join, relative } from 'node:path';
import { fileURLToPath } from 'node:url';
const __dir = dirname(fileURLToPath(import.meta.url));
const DESIGN = resolve(__dir, '../design');
const errors = [];
const err = (file, line, msg) =>
errors.push(`${relative(resolve(__dir, '..'), file)}:${line} ${msg}`);
// ─── 工具 ────────────────────────────────────────────────────────────────────
function walk(dir, exts, out = []) {
for (const name of readdirSync(dir)) {
const p = join(dir, name);
if (statSync(p).isDirectory()) walk(p, exts, out);
else if (exts.some((e) => name.endsWith(e))) out.push(p);
}
return out;
}
function parseBlock(css, selector) {
const out = {};
const re = new RegExp(`${selector.replace(/[[\]"=]/g, (m) => '\\' + m)}\\s*\\{([\\s\\S]*?)\\}`, 'g');
let m;
while ((m = re.exec(css))) {
const body = m[1].replace(/\/\*[\s\S]*?\*\//g, '');
for (const line of body.split(';')) {
const mm = line.match(/--([\w-]+)\s*:\s*(.+)/);
if (mm) out[mm[1].trim()] = mm[2].trim();
}
}
return out;
}
// ─── 解析 tokens ─────────────────────────────────────────────────────────────
const tokenFiles = readdirSync(join(DESIGN, 'tokens')).filter((f) => f.endsWith('.css')).sort();
const light = {}, dark = {};
for (const f of tokenFiles) {
const css = readFileSync(join(DESIGN, 'tokens', f), 'utf8');
Object.assign(light, parseBlock(css, ':root'));
Object.assign(dark, parseBlock(css, '[data-theme="dark"]'));
}
// tokens 合法值集(hex 大写 + rgba 去空格),供 ③ 比对
const tokenValues = new Set();
for (const v of [...Object.values(light), ...Object.values(dark)]) {
for (const hex of v.matchAll(/#[0-9a-fA-F]{3,8}\b/g)) tokenValues.add(hex[0].toUpperCase());
for (const fn of v.matchAll(/(?:rgba?|hsla?)\([^)]*\)/g)) tokenValues.add(fn[0].replace(/\s+/g, ''));
}
// ① dark ⊆ light
for (const k of Object.keys(dark)) {
if (!(k in light)) err(join(DESIGN, 'tokens'), 0, `① 孤儿 dark token:--${k} 未在 :root 定义`);
}
// ② var() 链可解析 + @import 存在
for (const [scopeName, scope] of [['light', light], ['dark', dark]]) {
for (const [k, v] of Object.entries(scope)) {
for (const ref of v.matchAll(/var\(--([\w-]+)\)/g)) {
if (!(ref[1] in light) && !(ref[1] in dark))
err(join(DESIGN, 'tokens'), 0, `② --${k}(${scopeName})引用了不存在的 var(--${ref[1]})`);
}
}
}
{
const styles = readFileSync(join(DESIGN, 'styles.css'), 'utf8');
for (const im of styles.matchAll(/@import\s+(?:url\()?['"]([^'"]+)['"]/g)) {
if (!existsSync(join(DESIGN, im[1]))) err(join(DESIGN, 'styles.css'), 0, `② @import 目标不存在:${im[1]}`);
}
}
// ③ design/ 裸色须 ∈ tokens 值集(ds-ignore 豁免;tokens/ 与资产 svg 不扫)
const scanFiles = [
...walk(join(DESIGN, 'guidelines'), ['.html', '.css']),
...walk(join(DESIGN, 'components'), ['.jsx', '.css', '.html']),
...walk(join(DESIGN, 'ui_kits'), ['.jsx', '.css', '.html']),
join(DESIGN, 'index.html'),
join(DESIGN, 'styles.css'),
];
for (const f of scanFiles) {
const lines = readFileSync(f, 'utf8').split('\n');
lines.forEach((line, i) => {
if (line.includes('ds-ignore:')) return;
for (const m of line.matchAll(/#[0-9a-fA-F]{3,8}\b|(?:rgba?|hsla?)\([^)]*\)/g)) {
const val = m[0].startsWith('#') ? m[0].toUpperCase() : m[0].replace(/\s+/g, '');
// #fff/#FFF 简写归一到 6 位再比对
const norm = /^#[0-9A-F]{3}$/.test(val)
? '#' + [...val.slice(1)].map((c) => c + c).join('')
: val;
if (!tokenValues.has(norm))
err(f, i + 1, `③ 裸色 ${m[0]} 不在 tokens 值集(改用 var(--*) 或加 ds-ignore: 理由)`);
}
});
}
// ④ 组件登记:components/**/*.jsx 导出名必须现于 index.html
const registry = readFileSync(join(DESIGN, 'index.html'), 'utf8');
for (const f of walk(join(DESIGN, 'components'), ['.jsx'])) {
const src = readFileSync(f, 'utf8');
for (const m of src.matchAll(/export\s+(?:function|const)\s+([A-Z]\w+)/g)) {
if (!registry.includes(`${m[1]}`) && !registry.includes(`${m[1]} `) && !new RegExp(`[^<]*\\b${m[1]}\\b`).test(registry))
err(f, 0, `④ 组件 ${m[1]} 未在登记簿 design/index.html 登记`);
}
}
// ⑤ icons.js:key 唯一 + 描边风格
{
const f = join(DESIGN, 'icons.js');
const src = readFileSync(f, 'utf8');
const keys = [...src.matchAll(/^\s{2}(\w+):/gm)].map((m) => m[1]);
const seen = new Set();
for (const k of keys) {
if (seen.has(k)) err(f, 0, `⑤ icons.js 重复 key:${k}`);
seen.add(k);
}
if (/fill="#/.test(src)) err(f, 0, '⑤ icons.js 含填充色(应为 stroke/currentColor 线条风格)');
globalThis.__iconKeys = seen;
}
// ⑥ icon-map.json ↔ icons.js 双向同集
{
const f = join(DESIGN, 'icon-map.json');
const map = JSON.parse(readFileSync(f, 'utf8'));
const webUsed = new Set();
for (const [name, v] of Object.entries(map)) {
if (name === '$schema') continue;
for (const col of ['web', 'ios', 'android']) {
if (!(col in v)) err(f, 0, `⑥ ${name} 缺 ${col} 列(未使用请置 null)`);
else if (v[col] !== null && typeof v[col] !== 'string') err(f, 0, `⑥ ${name}.${col} 应为 string|null`);
}
if (v.web) {
if (!globalThis.__iconKeys.has(v.web)) err(f, 0, `⑥ ${name}.web=${v.web} 不存在于 icons.js`);
webUsed.add(v.web);
}
}
for (const k of globalThis.__iconKeys) {
if (!webUsed.has(k)) err(f, 0, `⑥ icons.js 的 ${k} 未登记进 icon-map.json(web 列)`);
}
}
// ⑦ 界面文案禁 emoji(components + ui_kits 的 jsx/card.html)
const EMOJI = /[\u{1F000}-\u{1FAFF}\u{2600}-\u{27BF}\u{FE0F}]/u;
for (const f of [...walk(join(DESIGN, 'components'), ['.jsx', '.html']), ...walk(join(DESIGN, 'ui_kits'), ['.jsx', '.html'])]) {
readFileSync(f, 'utf8').split('\n').forEach((line, i) => {
if (line.includes('ds-ignore:')) return;
if (EMOJI.test(line)) err(f, i + 1, '⑦ 界面文案/原型含 emoji(品牌规范禁用;确属注释示例加 ds-ignore: 理由)');
});
}
// ─── 汇总 ────────────────────────────────────────────────────────────────────
if (errors.length) {
console.error(`❌ check-ds:${errors.length} 处违规\n` + errors.map((e) => ' ' + e).join('\n'));
process.exit(1);
}
console.log('✅ check-ds:真相源自检 7 道全绿');