2025-12-29 10:41:23 +08:00
|
|
|
|
## todo
|
|
|
|
|
|
|
2025-12-30 19:19:38 +08:00
|
|
|
|
解决 cookies 重合问题
|
|
|
|
|
|
|
|
|
|
|
|
导航栏菜单项
|
|
|
|
|
|
|
|
|
|
|
|
页面表格内单元样式细化
|
|
|
|
|
|
|
|
|
|
|
|
仪表盘填充真实数据
|
2026-03-03 17:15:29 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#### 下载代码
|
|
|
|
|
|
1. 下载本地项目,安装项目依赖包,运行:bun install
|
|
|
|
|
|
2. 确定本地开发环境正常:需要安装node.js bun git
|
|
|
|
|
|
3. 下载代码编辑器:vscode 并且安装好插件:ts biome tailwind css mdx
|
|
|
|
|
|
4. 创建环境变量文件 .env,复制 .env.example 中的内容到 .env,并根据实际情况修改
|
|
|
|
|
|
5. 启动项目终端运行 bun run dev
|
|
|
|
|
|
|
|
|
|
|
|
### 上传代码
|
|
|
|
|
|
1. 使用git命令上传至master分支:
|
|
|
|
|
|
#### 添加所有文件
|
|
|
|
|
|
- git add .
|
|
|
|
|
|
#### 查看文件状态
|
|
|
|
|
|
- git status
|
|
|
|
|
|
#### 提交到本地仓库
|
|
|
|
|
|
- git commit -m "提交说明"
|
|
|
|
|
|
#### 推送到远程仓库
|
|
|
|
|
|
- git push -u origin master
|
|
|
|
|
|
|
|
|
|
|
|
#### 确保已配置Git用户信息:
|
|
|
|
|
|
- git config --global user.name "你的用户名"
|
|
|
|
|
|
- git config --global user.email "你的邮箱"
|
|
|
|
|
|
|
|
|
|
|
|
#### git 发布版本命令
|
|
|
|
|
|
- 首先在package.json文件中跟新最新版本号"version": "1.0.2",
|
|
|
|
|
|
- 然后终端执行./publish.ps1 <版本号>
|
|
|
|
|
|
- 在gitea项目地址页面选择 发布 -- 发布最新版本号
|
|
|
|
|
|
- 返回后可以在 代码 -- 提交记录中查看发布的版本是否挂载正确
|
|
|
|
|
|
|
|
|
|
|
|
#### 目录结构
|
|
|
|
|
|
|
|
|
|
|
|
public/ # 静态资源(图片、字体等)
|
|
|
|
|
|
src/
|
|
|
|
|
|
├── actions/ # 服务端 Action(表单提交、数据操作等)
|
|
|
|
|
|
├── app/ # App Router 核心目录
|
|
|
|
|
|
│ ├── (root)/ # 根路由组(无路径前缀)
|
|
|
|
|
|
│ ├── login/ # /login 路由页面
|
|
|
|
|
|
│ ├── favicon.ico # 网站图标
|
|
|
|
|
|
│ ├── globals.css # 全局样式
|
|
|
|
|
|
│ └── layout.tsx # 根布局组件
|
|
|
|
|
|
├── components/ # 可复用 UI 组件
|
|
|
|
|
|
├── hooks/ # 自定义 React Hooks
|
|
|
|
|
|
├── lib/ # 工具函数、第三方库封装
|
|
|
|
|
|
├── models/ # 数据模型、类型定义、Schema
|
|
|
|
|
|
└── proxy.ts # 代理配置(API 转发等)
|
|
|
|
|
|
.env # 环境变量(本地开发)
|
|
|
|
|
|
.env.example # 环境变量示例模板
|
|
|
|
|
|
.gitignore # Git 忽略文件
|
|
|
|
|
|
.npmrc # npm 配置
|
|
|
|
|
|
biome.json # Biome 代码格式化/检查配置
|
|
|
|
|
|
bun.lock # Bun 包管理器锁文件
|
|
|
|
|
|
components.json # shadcn/ui 组件库配置
|
|
|
|
|
|
Dockerfile # Docker 容器化配置
|
|
|
|
|
|
next-env.d.ts # Next.js 类型声明
|
|
|
|
|
|
next.config.ts # Next.js 配置文件
|
|
|
|
|
|
package.json # 项目依赖与脚本
|
|
|
|
|
|
postcss.config.mjs # PostCSS 配置
|
|
|
|
|
|
README.md # 项目说明文档
|
|
|
|
|
|
tsconfig.json # TypeScript 配置
|
|
|
|
|
|
|
|
|
|
|
|
#### 项目使用到的技术栈
|
|
|
|
|
|
|
|
|
|
|
|
核心框架:
|
|
|
|
|
|
- nextjs 服务框架 https://nextjs.org/docs
|
|
|
|
|
|
- react 前端 UI 框架 https://react.dev/learn
|
|
|
|
|
|
- typescript (ts) 类型安全的 JavaScript 超集 https://www.typescriptlang.org/docs/
|
|
|
|
|
|
- bun 包管理器 / 运行时 https://bun.sh/docs
|
|
|
|
|
|
|
|
|
|
|
|
UI / 样式体系:
|
|
|
|
|
|
- radix-ui 无样式的基础 UI 组件库 https://www.radix-ui.com/docs/primitives/overview/introduction
|
|
|
|
|
|
- tailwindcss css 库 https://tailwindcss.com/
|
|
|
|
|
|
- tailwindcss-animate Tailwind CSS 动画插件 https://github.com/jamiebuilds/tailwindcss-animate
|
|
|
|
|
|
- tw-animate-css 扩展的 Tailwind 动画库 https://github.com/ixartz/tw-animate-css
|
|
|
|
|
|
- class-variance-authority (cva) 样式变体管理工具 https://cva.style/docs
|
|
|
|
|
|
- clsx/tailwind-merge CSS 类名处理工具 https://github.com/lukeed/clsx / https://github.com/dcastil/tailwind-merge
|
|
|
|
|
|
- lucide-react 图标库 https://lucide.dev/icons/
|
|
|
|
|
|
- next-themes 主题切换(暗黑 / 亮色模式) https://github.com/pacocoursey/next-themes
|
|
|
|
|
|
|
|
|
|
|
|
表单与数据验证:
|
|
|
|
|
|
- react-hook-form 表单处理库 https://react-hook-form.com/get-started
|
|
|
|
|
|
- @hookform/resolvers react-hook-form 校验解析器 https://react-hook-form.com/api/useform/resolver
|
|
|
|
|
|
- zod 数据验证库 https://zod.dev/
|
|
|
|
|
|
- date-fns 时间处理库 https://date-fns.org/docs/Getting-Started
|
|
|
|
|
|
|
|
|
|
|
|
数据管理与展示:
|
|
|
|
|
|
- zustand 状态管理库 https://zustand-demo.pmnd.rs/
|
|
|
|
|
|
- @tanstack/react-table 表格处理库 https://tanstack.com/table/latest/docs/guide/introduction
|
|
|
|
|
|
|
|
|
|
|
|
工程化与开发工具:
|
|
|
|
|
|
- eslint 代码检查工具 https://eslint.org/docs/latest/
|
|
|
|
|
|
- @biomejs/biome 代码格式化 / 检查工具 https://biomejs.dev/guides/getting-started/
|
|
|
|
|
|
- babel-plugin-react-compiler React 编译器插件(性能优化) https://react.dev/blog/2024/04/25/react-compiler
|
|
|
|
|
|
- typescript 类型检查 https://www.typescriptlang.org/docs/
|
|
|
|
|
|
|
|
|
|
|
|
部署与构建:
|
|
|
|
|
|
- Docker 容器化部署运行环境 https://www.docker.com/get-started
|
|
|
|
|
|
- Turbopack Next.js 新一代构建工具(脚本中启用 --turbopack) https://turbo.build/pack/docs/introduction
|