站点:纯静态 HTML + CSS + 原生 JS,零框架零构建
页面:首页 / 合作品牌 / 荣誉资质 / 客户案例 / 关于我们
内容:
- site/ 站点本体(含已压缩 webp 图片,约 4.8 MB)
- deploy/ Docker Compose / Caddy / Apache 部署配置
- _tools/ 开发自检脚本与部署脚本
- Dockerfile 自建 nginx 镜像方案
- README.md 项目文档
设计:品牌黄 #ffc107 + 白,深蓝仅用于页脚;菜单长期置顶;
交互动效只加在关键词与区块级元素上。
素材说明:原始素材(背景图/老网站/方案/荣誉资质/合作品牌,约 290 MB)
未纳入版本控制,站点使用的是 site/assets 内已处理压缩的图片。
32 lines
1.3 KiB
JavaScript
32 lines
1.3 KiB
JavaScript
// 检查 HTML 中用到的 class 是否都在 CSS 中有定义,并列出 CSS 中未被使用的 class
|
|
const fs = require('fs');
|
|
const path = require('path');
|
|
|
|
const SITE = path.join(__dirname, '..', 'site');
|
|
const PAGES = ['index.html', 'brands.html', 'honors.html', 'cases.html', 'about.html'];
|
|
const css = fs.readFileSync(path.join(SITE, 'assets/css/main.css'), 'utf8');
|
|
|
|
const defined = new Set([...css.matchAll(/\.([a-zA-Z][\w-]*)/g)].map(m => m[1]));
|
|
const used = new Set();
|
|
for (const f of PAGES) {
|
|
const html = fs.readFileSync(path.join(SITE, f), 'utf8');
|
|
for (const m of html.matchAll(/class="([^"]*)"/g)) {
|
|
m[1].split(/\s+/).filter(Boolean).forEach(c => used.add(c));
|
|
}
|
|
}
|
|
|
|
const missing = [...used].filter(c => {
|
|
if (defined.has(c)) return false;
|
|
// 允许的运行时状态类(由 JS 添加,CSS 里以 body.xxx 或 .xxx 形式出现)
|
|
return true;
|
|
}).sort();
|
|
|
|
const unused = [...defined].filter(c => !used.has(c) && !/^(js|is|has|no)-/.test(c)).sort();
|
|
|
|
console.log('== HTML 使用但 CSS 未定义的 class ==');
|
|
if (missing.length) missing.forEach(c => console.log(' x .' + c));
|
|
else console.log(' (无)');
|
|
|
|
console.log('\n== CSS 定义但页面未使用的 class(可清理,不影响显示)==');
|
|
console.log(' ' + (unused.length ? unused.join(', ') : '(无)'));
|