sora-blue / pnavi Goto Github PK

做了一个自用的导航页，技术栈是 Vite + React + TypeScript + Less

搜索窗口自己摸索了一下，工具箱照搬 Google 的 CSS

整理一下开源出来，算是给前端之旅划上一个句号

1. 自定义程度高，可以自行 增删改 工具箱和搜索窗口的项
2. 隐私安全，数据100%本地存储，导入导出方便
3. 100%无广告，可以自己部署
4. 可配置初始的默认项
5. 按照 LRU 排序

示例网站

自定义background的css属性进行裁剪

url("https://rescdn.qqmail.com/zh_CN/htmledition/images/logo/logo_13_01e9c5d.gif") no-repeat scroll -12px

只填logo链接的默认效果

自定义效果

0. 安装依赖
1. 构建静态文件

git clone https://github.com/sora-blue/pnavi
cd pnavi
npm i && npm run build

2. 新建Github公开库，库名为你的Github用户名.github.io，详见
3. 将dist目录下的文件都上传到这个库里

0. 购买服务器，建议最低配置1核2G
1. 安装 nodejs npm

curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
sudo npm config set registry https://registry.npm.taobao.org

2. 运行

git clone https://github.com/sora-blue/pnavi
cd pnavi
npm i && npm run devhost