op-packages/luci-theme-shadcn/README_zh.md

English | 简体中文

一款基于 shadcn/ui 设计语言构建的现代侧边栏 OpenWrt LuCI 主题。

_{背景图：挪威海峡。}

特性

• 侧边栏布局：可折叠侧边栏，支持手风琴式子菜单与移动端抽屉。
• 快且丝滑的导航体验：在支持的浏览器上，切换页面时只更新内容、不整页刷新，切换起来丝滑流畅，加载速度大幅提升（详见路由文档）。这套无刷新切换的思路参考了 luci-theme-footstrap。
• 深色/浅色模式：内置切换按钮，偏好自动保存，加载时无闪烁恢复。
• 命令面板（⌘K）：在顶栏一键搜索并跳转到任意页面。
• shadcn/ui 设计：现代简洁的视觉风格，参考了其 Dashboard 布局。
• 现代技术栈：界面加载迅速、切换流畅，字体与图标经过精心挑选。

预览

兼容性

• OpenWrt：需要 OpenWrt 23.05.0 或更高版本（依赖 ucode 模板和 LuCI JavaScript APIs）。
• 浏览器：基于 TailwindCSS v4 构建。兼容以下现代浏览器：
  • Chrome/Edge 111+ (2023 年 3 月发布)
  • Safari 16.4+ (2023 年 3 月发布)
  • Firefox 128+ (2024 年 7 月发布)
  • 可选增强，非必需： 页面间的同文档导航（点菜单不整页刷新）在支持的浏览器上使用 Navigation API——Chrome/Edge 105+、Safari 26.2+、Firefox 147+；不支持的浏览器自动保持传统整页跳转，功能不受影响。

安装

以下命令均在路由器本机执行（例如通过 SSH 会话）。

通过 eamonxg 软件源

wget -qO- https://openwrt.eamonxg.fun/install.sh | sh

这就是全部安装步骤——脚本会添加软件源，并安装您从列表中勾选的软件包。之后用常规命令升级即可：apk update && apk upgrade luci-theme-shadcn，或 opkg update && opkg upgrade luci-theme-shadcn。详细信息见 openwrt.eamonxg.fun。

apk：若此前是从下载的 .apk 文件安装的，该文件会把软件包钉死在 /etc/apk/world 里，此后 apk upgrade 会静默地什么都不做——报告成功，版本却没变。执行一次 apk add luci-theme-shadcn（只写包名，不带路径）即可解除。上面的脚本已自动处理这一步。

通过 GitHub Release

OpenWrt 25.12+ 及 Snapshot 版本使用 apk；旧版本使用 opkg。

提示：运行 opkg --version 或 apk --version，有输出的那个就是您设备的包管理器。

cd /tmp

# opkg
uclient-fetch -O luci-theme-shadcn.ipk https://github.com/eamonxg/luci-theme-shadcn/releases/latest/download/luci-theme-shadcn_0.5.0-r20260830_all.ipk
opkg install luci-theme-shadcn.ipk

# apk
uclient-fetch -O luci-theme-shadcn.apk https://github.com/eamonxg/luci-theme-shadcn/releases/latest/download/luci-theme-shadcn-0.5.0-r20260830.apk
apk add --allow-untrusted luci-theme-shadcn.apk

从源码构建

使用 OpenWrt 构建系统自行编译。主机前置条件见 Build system setup。产物位于 bin/packages/<arch>/base/（例如 bin/packages/x86_64/base/luci-theme-shadcn_*_all.ipk），拷贝到路由器后按上文方式安装即可。

通过完整源码或 SDK

准备环境——克隆完整源码：

# 完整源码——openwrt-24.10 分支构建 .ipk，main 分支构建 .apk
git clone https://github.com/openwrt/openwrt.git
cd openwrt
git checkout openwrt-24.10

或 预编译 SDK（更快，省去编译工具链）。从 downloads.openwrt.org 下载与目标匹配的压缩包，下载页面按 Release 和 Snapshot 分类——Release 24.10.x 及以下构建 .ipk；Release 25.12+ 和 Snapshot 构建 .apk（文件名、架构、压缩格式因目标而异）：

wget <从 downloads.openwrt.org 获取的 SDK 压缩包地址>
tar -xf openwrt-sdk-*.tar.*
cd openwrt-sdk-*/

然后在该目录下：

# 加入本软件包并安装 feeds（提供 luci-base）
git clone https://github.com/eamonxg/luci-theme-shadcn.git package/luci-theme-shadcn
./scripts/feeds update -a
./scripts/feeds install -a

# 在 menuconfig 中勾选主题：LuCI → Themes → luci-theme-shadcn
make menuconfig

# 用 SDK 时跳过这两行——它已自带编译好的工具链
make tools/install -j$(nproc)
make toolchain/install -j$(nproc)

make package/luci-theme-shadcn/compile -j$(nproc) V=s

许可与致谢

Apache 2.0。致谢：

• shadcn/ui — Logo 就是它的标志加了一道斜线，让它看起来更像 Wi-Fi 信号
• Lucide — 图标库
• Linear — 色彩系统灵感
• Vite 和 Tailwind CSS
• luci-theme-bootstrap — 模板结构与 LuCI 集成参考
• luci-theme-material — 侧边栏菜单渲染参考
• luci-theme-footstrap — 一个自带客户端路由的 LuCI 主题。同文档导航借鉴了它的部分思路，并改用 Navigation API 实现——详见路由文档
• Claude Code