zhongyidianandClaude
21a48c948c
- 基于 React 19 + Vite 7 + Tailwind CSS 4 - 实现拖拽排序功能 (@dnd-kit) - 5个传感器实验项目展示 - 响应式设计和现代化 UI - 修复拖拽释放到空白区域时的潜在 bug 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
65 lines
1.2 KiB
Markdown
65 lines
1.2 KiB
Markdown
# 传感器及检测技术 - 实验课件系统
|
|
|
|
这是一个基于 React 的传感器及检测技术实验课件交互式平台。
|
|
|
|
## 技术栈
|
|
|
|
- **框架**: React 19 + Vite 7
|
|
- **样式**: Tailwind CSS 4
|
|
- **路由**: React Router Dom 7
|
|
- **拖拽**: @dnd-kit
|
|
- **HTTP 客户端**: Axios
|
|
- **图标**: Lucide React
|
|
- **包管理器**: pnpm
|
|
|
|
## 开发环境要求
|
|
|
|
- Node.js 18+
|
|
- pnpm 10+
|
|
|
|
## 安装依赖
|
|
|
|
```bash
|
|
pnpm install
|
|
```
|
|
|
|
## 开发命令
|
|
|
|
```bash
|
|
# 启动开发服务器
|
|
pnpm dev
|
|
|
|
# 构建生产版本
|
|
pnpm build
|
|
|
|
# 预览生产构建
|
|
pnpm preview
|
|
|
|
# 代码检查
|
|
pnpm lint
|
|
```
|
|
|
|
## 项目特性
|
|
|
|
- 支持拖拽交互的实验课件展示
|
|
- 响应式设计，适配多种设备
|
|
- 模块化组件架构
|
|
- 现代化的 UI 设计
|
|
|
|
## 项目结构
|
|
|
|
```
|
|
sensor-lab/
|
|
├── src/
|
|
│ ├── components/ # 可复用组件
|
|
│ ├── assets/ # 静态资源
|
|
│ ├── App.jsx # 主应用组件
|
|
│ └── main.jsx # 应用入口
|
|
├── public/ # 公共资源
|
|
└── index.html # HTML 模板
|
|
```
|
|
|
|
## 开发说明
|
|
|
|
本项目使用 **pnpm** 作为包管理工具，请勿使用 npm 或 yarn 安装依赖，以保持依赖的一致性。
|