由于上个仓库主线和分支差距过大且主线不再使用所以新建此仓库
This commit is contained in:
204
README.md
Normal file
204
README.md
Normal file
@@ -0,0 +1,204 @@
|
||||
# Linux 镜像源文件浏览器
|
||||
|
||||
一个使用 Next.js 构建的现代化 Linux 镜像源文件浏览网站,支持暗黑模式、镜像源自动配置等功能。
|
||||
|
||||
## 🚀 特性
|
||||
|
||||
- **现代化界面**: 基于 Next.js 16 和 Tailwind CSS 4 构建的响应式界面
|
||||
- **文件浏览**: 支持列表和网格两种视图模式
|
||||
- **暗黑模式**: 自动检测系统主题,支持手动切换
|
||||
- **镜像源配置**: 一键生成常用 Linux 发行版的镜像源配置命令
|
||||
- **搜索功能**: 快速搜索文件和目录
|
||||
- **实时统计**: 显示目录数量、文件数量和总大小
|
||||
- **配置文件**: 通过 JSON 配置文件轻松自定义
|
||||
|
||||
## 📦 支持的 Linux 发行版
|
||||
|
||||
- Ubuntu (Debian 包管理器)
|
||||
- CentOS/RHEL (YUM/DNF 包管理器)
|
||||
- Debian (APT 包管理器)
|
||||
- Arch Linux (Pacman 包管理器)
|
||||
- Fedora (DNF 包管理器)
|
||||
|
||||
## 🛠️ 技术栈
|
||||
|
||||
- **前端**: Next.js 16 (App Router), React 19, TypeScript
|
||||
- **样式**: Tailwind CSS 4, Font Awesome 6
|
||||
- **构建工具**: Turbopack, ESLint
|
||||
- **部署**: 支持 Vercel, Docker 等多种部署方式
|
||||
|
||||
## 🚀 快速开始
|
||||
|
||||
### 1. 安装依赖
|
||||
|
||||
```bash
|
||||
npm install
|
||||
# 或
|
||||
yarn install
|
||||
# 或
|
||||
pnpm install
|
||||
```
|
||||
|
||||
### 2. 启动开发服务器
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
# 或
|
||||
yarn dev
|
||||
```
|
||||
|
||||
### 3. 打开浏览器
|
||||
|
||||
访问 [http://localhost:3000](http://localhost:3000) 查看应用。
|
||||
|
||||
## ⚙️ 配置
|
||||
|
||||
项目通过 `config.json` 文件进行配置:
|
||||
|
||||
```json
|
||||
{
|
||||
"mirror": {
|
||||
"name": "Linux 镜像源",
|
||||
"description": "快速、稳定的 Linux 发行版镜像服务",
|
||||
"baseUrl": "https://mirror.example.com"
|
||||
},
|
||||
"directories": [
|
||||
{
|
||||
"name": "ubuntu",
|
||||
"path": "/var/mirror/ubuntu",
|
||||
"description": "Ubuntu Linux 发行版",
|
||||
"icon": "fab fa-ubuntu",
|
||||
"color": "#E95420"
|
||||
}
|
||||
],
|
||||
"features": {
|
||||
"enableSearch": true,
|
||||
"enableDarkMode": true,
|
||||
"enableStats": true,
|
||||
"enableDownload": true,
|
||||
"enableCopyLink": true
|
||||
},
|
||||
"ui": {
|
||||
"itemsPerPage": 50,
|
||||
"defaultView": "list",
|
||||
"showHiddenFiles": false
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 📁 项目结构
|
||||
|
||||
```
|
||||
src/
|
||||
├── app/ # Next.js App Router
|
||||
│ ├── api/ # API 路由
|
||||
│ │ ├── browse/ # 文件浏览 API
|
||||
│ │ ├── command/ # 镜像源配置 API
|
||||
│ │ └── config/ # 配置信息 API
|
||||
│ ├── globals.css # 全局样式
|
||||
│ ├── layout.tsx # 根布局
|
||||
│ └── page.tsx # 主页面
|
||||
├── components/ # React 组件
|
||||
│ ├── FileBrowser.tsx # 文件浏览器组件
|
||||
│ ├── Header.tsx # 头部组件
|
||||
│ ├── Footer.tsx # 底部组件
|
||||
│ └── CommandModal.tsx # 镜像源配置弹窗
|
||||
├── lib/ # 工具库
|
||||
│ ├── config.ts # 配置读取
|
||||
│ ├── filesystem.ts # 文件系统操作
|
||||
│ └── demo-data.ts # 演示数据
|
||||
└── types/ # TypeScript 类型定义
|
||||
└── index.ts
|
||||
```
|
||||
|
||||
## 🏗️ 部署
|
||||
|
||||
### Vercel 部署 (推荐)
|
||||
|
||||
1. 将代码推送到 GitHub
|
||||
2. 在 Vercel 中导入项目
|
||||
3. 配置环境变量
|
||||
4. 自动部署完成
|
||||
|
||||
### Docker 部署
|
||||
|
||||
```bash
|
||||
# 构建镜像
|
||||
docker build -t linux-mirror-browser .
|
||||
|
||||
# 运行容器
|
||||
docker run -p 3000:3000 -v /path/to/mirror:/var/mirror linux-mirror-browser
|
||||
```
|
||||
|
||||
### 传统部署
|
||||
|
||||
```bash
|
||||
# 构建项目
|
||||
npm run build
|
||||
|
||||
# 启动生产服务器
|
||||
npm start
|
||||
```
|
||||
|
||||
## 🔧 自定义
|
||||
|
||||
### 添加新的 Linux 发行版
|
||||
|
||||
1. 在 `config.json` 的 `directories` 中添加新目录
|
||||
2. 在 `linuxCommands` 中添加对应的配置命令
|
||||
3. 在 `src/lib/demo-data.ts` 中添加演示数据(可选)
|
||||
|
||||
### 修改样式
|
||||
|
||||
- 编辑 `src/app/globals.css` 添加自定义样式
|
||||
- 修改 `tailwind.config.js` 配置 Tailwind CSS
|
||||
|
||||
### 扩展功能
|
||||
|
||||
- 在 `src/app/api/` 下添加新的 API 路由
|
||||
- 在 `src/components/` 下添加新的组件
|
||||
|
||||
## 🔒 安全注意事项
|
||||
|
||||
1. **路径安全**: 项目包含路径验证,防止目录遍历攻击
|
||||
2. **文件权限**: 确保运行用户有适当权限访问镜像目录
|
||||
3. **网络安全**: 生产环境建议配置 HTTPS 和防火墙
|
||||
|
||||
## 🤝 贡献
|
||||
|
||||
欢迎提交 Issue 和 Pull Request!
|
||||
|
||||
## 📄 许可证
|
||||
|
||||
MIT License
|
||||
|
||||
## 🙏 致谢
|
||||
|
||||
- [Next.js](https://nextjs.org/) - React 框架
|
||||
- [Tailwind CSS](https://tailwindcss.com/) - CSS 框架
|
||||
- [Font Awesome](https://fontawesome.com/) - 图标库
|
||||
- [Context7](https://context7.dev/) - 技术文档支持
|
||||
|
||||
## 📱 功能演示
|
||||
|
||||
### 主要功能
|
||||
|
||||
1. **文件浏览**: 以列表或网格形式浏览镜像文件
|
||||
2. **搜索**: 实时搜索文件和目录
|
||||
3. **镜像源配置**: 点击"添加镜像源"按钮生成配置命令
|
||||
4. **暗黑模式**: 点击月亮/太阳图标切换主题
|
||||
5. **响应式设计**: 支持手机、平板和桌面设备
|
||||
|
||||
### 使用镜像源配置
|
||||
|
||||
1. 点击页面顶部的"添加镜像源"按钮
|
||||
2. 选择您的 Linux 发行版
|
||||
3. 复制生成的命令
|
||||
4. 在终端中执行命令
|
||||
5. 更新软件包列表
|
||||
|
||||
### 配置文件说明
|
||||
|
||||
- `config.json`: 主配置文件,包含镜像源信息、目录配置和功能开关
|
||||
- 支持通过修改配置文件来自定义界面颜色、图标、功能等
|
||||
- 配置更改后需要重启开发服务器
|
||||
Reference in New Issue
Block a user