12451
|
2aa002ca02
|
feat: 全站统一 favicon.svg（取自品牌 logo，替换 Vite 模板紫色闪电）
## 背景
- `software/web/public/favicon.svg` 一直是 **Vite/Arco 模板自带的紫色闪电**
（`#863bff`），与项目品牌无关；
- 官网 `deploy/landing/index.html` **完全没有 favicon 引用**；
- 仓库里本来就有品牌 logo：`logo/圆切独立LOGO.svg`（蓝色渐变底 + 白色充电柜
6 仓 + 柜顶青色闪电 + 右侧白色圆弧 + 底部青色弧线）。
## 做法
新增规范文件 `logo/favicon.svg`，由 `圆切独立LOGO.svg` **机械变换**而来
（不改任何路径数据）：
1. `<style>` 里的 class 上色 → **内联成 `fill`/`opacity` 属性**（favicon 渲染器
对 SVG 内 CSS 支持不一，内联更稳）；
2. 渐变 ID `未命名的渐变_5`（中文）→ **`lgBrandBlue`**（ASCII）
（`url(#中文)` 在部分渲染链路上会断）；
3. 删掉 `<style>` 块；
4. 加 `<title>艾动智能 · 充电柜</title>`。
变换前后**渲染等价已用 resvg 逐像素验证**：
- 16px / 32px（favicon 真实尺寸）：**逐字节一致**；
- 256px：262144 字节中 3 字节不同，且集中在**同一个抗锯齿边界像素** (173,46)，
最大单通道差 9/255 —— 渐变舍入，视觉无差异。
## 落点
| 位置 | 改动 |
|---|---|
| `logo/favicon.svg` | 新增（规范源） |
| `software/web/public/favicon.svg` | 覆盖（管理端；`index.html` L5 已有 `<link rel="icon">`，无需改） |
| `deploy/landing/favicon.svg` | 新增 |
| `deploy/landing/index.html` | 补 `<link rel="icon" type="image/svg+xml" href="/favicon.svg" />` |
**小程序（h5-uniapp）不适用**：微信小程序没有浏览器 favicon 概念
（无 HTML 入口，实测 `src/` 下无 index.html）；tabBar 图标是另一套 PNG，不属 favicon。
## 实测（发布后打真实 URL）
```
app.anzhizhichong.com/favicon.svg → 200 image/svg+xml 21.1KB 新logo ✓
app.anzhizhichong.com/pms/favicon.svg → 200 image/svg+xml 21.1KB 新logo ✓
test.anzhizhichong.com/pms/favicon.svg → 200 image/svg+xml 21.1KB 新logo ✓
```
三处均确认**无旧模板紫色残留**（`863bff`）。
`test.anzhizhichong.com/favicon.svg` 返回 404 是**预期**：测试域名 nginx
`root /data/pms_dev`，官网只挂生产域名。
## 验收
- `npm run build`：exit 0，产物含新 favicon.svg（21.1KB）
- 已发布：生产（web + 官网 favicon/index.html）、测试（web）
- nginx `nginx -t` 通过后 reload；生产 0 ERROR、域名 401/200
|
2026-09-21 00:54:39 +08:00 |
|