初始化项目：添加基础配置和依赖
- 添加TypeScript配置 - 添加Vite构建配置 - 添加项目依赖（React 18, Ant Design 5, React Router等） - 添加.gitignore配置
This commit is contained in:
Leo
commit
7abc7becee
24
.gitignore
vendored
Normal file
24
.gitignore
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
381
DESIGN.md
Normal file
381
DESIGN.md
Normal file
@ -0,0 +1,381 @@
|
||||
# 非遗文化传承平台 - 设计规范
|
||||
|
||||
## 🎨 设计理念
|
||||
|
||||
### 核心设计原则
|
||||
|
||||
1. **文化传承** - 尊重传统，融入现代设计语言
|
||||
2. **视觉层次** - 清晰的信息架构和内容组织
|
||||
3. **体验优先** - 流畅的交互和良好的可用性
|
||||
4. **品牌一致** - 统一的视觉风格和设计语言
|
||||
|
||||
### 设计关键词
|
||||
|
||||
- 传承千年（Heritage）
|
||||
- 匠心独运（Craftsmanship）
|
||||
- 文化自信（Cultural Pride）
|
||||
- 活态传承（Living Heritage）
|
||||
- 创新融合（Innovation & Fusion）
|
||||
|
||||
## 🎨 色彩系统
|
||||
|
||||
### 主色调
|
||||
|
||||
基于中国传统色彩体系，选取代表性色彩：
|
||||
|
||||
```css
|
||||
/* 朱砂红 - 主品牌色 */
|
||||
--color-primary: #C8363D;
|
||||
--color-primary-hover: #A82E34;
|
||||
--color-primary-active: #8B252B;
|
||||
|
||||
/* 金沙黄 - 强调色 */
|
||||
--color-accent: #D4A574;
|
||||
|
||||
/* 墨绿 - 辅助色 1 */
|
||||
--color-auxiliary-1: #2A5E4D;
|
||||
|
||||
/* 青黛蓝 - 辅助色 2 */
|
||||
--color-auxiliary-2: #4A5F7F;
|
||||
```
|
||||
|
||||
### 背景色
|
||||
|
||||
```css
|
||||
/* 宣纸色 - 基础背景 */
|
||||
--color-bg-base: #FAFAF8;
|
||||
|
||||
/* 纯白 - 容器背景 */
|
||||
--color-bg-container: #FFFFFF;
|
||||
|
||||
/* 浅米黄 - Section 背景 */
|
||||
--color-bg-section: #F5F0E8;
|
||||
```
|
||||
|
||||
### 文本色
|
||||
|
||||
```css
|
||||
/* 深灰黑 - 主文本 */
|
||||
--color-text-primary: #2C2C2C;
|
||||
|
||||
/* 中灰 - 次要文本 */
|
||||
--color-text-secondary: #666666;
|
||||
|
||||
/* 浅灰 - 辅助文本 */
|
||||
--color-text-tertiary: #999999;
|
||||
|
||||
/* 极浅灰 - 占位文本 */
|
||||
--color-text-quaternary: #CCCCCC;
|
||||
```
|
||||
|
||||
### 语义色
|
||||
|
||||
```css
|
||||
--color-success: #52C41A;
|
||||
--color-warning: #FAAD14;
|
||||
--color-error: #FF4D4F;
|
||||
--color-info: #1890FF;
|
||||
```
|
||||
|
||||
### 渐变
|
||||
|
||||
```css
|
||||
/* 主品牌渐变 */
|
||||
background: linear-gradient(135deg, #C8363D 0%, #8B252B 100%);
|
||||
|
||||
/* 温暖渐变 */
|
||||
background: linear-gradient(135deg, #FFF9F0 0%, #F5F0E8 100%);
|
||||
|
||||
/* 优雅渐变 */
|
||||
background: linear-gradient(135deg, #FAFAF8 0%, #FFFFFF 50%, #F5F0E8 100%);
|
||||
```
|
||||
|
||||
## 📝 字体系统
|
||||
|
||||
### 字体家族
|
||||
|
||||
```css
|
||||
/* 标题 - 衬线字体 */
|
||||
--font-family-serif: 'Noto Serif SC', 'Songti SC', Georgia, serif;
|
||||
|
||||
/* 正文 - 无衬线字体 */
|
||||
--font-family-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
||||
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Noto Sans SC',
|
||||
'Microsoft YaHei';
|
||||
```
|
||||
|
||||
### 字号等级
|
||||
|
||||
```css
|
||||
--font-size-h1: 38px;
|
||||
--font-size-h2: 30px;
|
||||
--font-size-h3: 24px;
|
||||
--font-size-h4: 20px;
|
||||
--font-size-h5: 16px;
|
||||
|
||||
--font-size-base: 14px;
|
||||
--font-size-lg: 16px;
|
||||
--font-size-sm: 12px;
|
||||
```
|
||||
|
||||
### 行高
|
||||
|
||||
```css
|
||||
--line-height-base: 1.5715;
|
||||
--line-height-heading: 1.2;
|
||||
```
|
||||
|
||||
### 字重
|
||||
|
||||
```css
|
||||
--font-weight-normal: 400;
|
||||
--font-weight-medium: 500;
|
||||
--font-weight-semibold: 600;
|
||||
--font-weight-bold: 700;
|
||||
```
|
||||
|
||||
## 📐 间距系统
|
||||
|
||||
### 基础间距
|
||||
|
||||
```css
|
||||
--spacing-xs: 8px;
|
||||
--spacing-sm: 12px;
|
||||
--spacing-md: 16px;
|
||||
--spacing-lg: 24px;
|
||||
--spacing-xl: 32px;
|
||||
--spacing-xxl: 48px;
|
||||
```
|
||||
|
||||
### Section 间距
|
||||
|
||||
```css
|
||||
--section-spacing: 80px;
|
||||
--section-spacing-lg: 120px;
|
||||
--section-spacing-sm: 60px;
|
||||
```
|
||||
|
||||
## 🎯 圆角系统
|
||||
|
||||
```css
|
||||
--border-radius-base: 8px;
|
||||
--border-radius-lg: 12px;
|
||||
--border-radius-sm: 6px;
|
||||
--border-radius-xs: 4px;
|
||||
```
|
||||
|
||||
## 🌫️ 阴影系统
|
||||
|
||||
```css
|
||||
/* 小阴影 - 卡片、按钮 */
|
||||
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||
|
||||
/* 中阴影 - 悬浮卡片 */
|
||||
--shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
|
||||
|
||||
/* 大阴影 - Modal、Drawer */
|
||||
--shadow-lg: 0 6px 24px rgba(0, 0, 0, 0.16);
|
||||
|
||||
/* 超大阴影 - 特殊强调 */
|
||||
--shadow-xl: 0 12px 48px rgba(0, 0, 0, 0.2);
|
||||
|
||||
/* 纸张层叠效果 */
|
||||
--shadow-paper:
|
||||
0 2px 4px rgba(0, 0, 0, 0.08),
|
||||
0 4px 8px rgba(0, 0, 0, 0.06),
|
||||
0 1px 2px rgba(0, 0, 0, 0.04);
|
||||
```
|
||||
|
||||
## 🎬 动画系统
|
||||
|
||||
### 动画时长
|
||||
|
||||
```css
|
||||
--duration-fast: 0.2s;
|
||||
--duration-base: 0.3s;
|
||||
--duration-slow: 0.5s;
|
||||
```
|
||||
|
||||
### 缓动函数
|
||||
|
||||
```css
|
||||
--ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
--ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||
```
|
||||
|
||||
### 常用动画
|
||||
|
||||
```css
|
||||
/* 渐显 */
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
|
||||
/* 上滑渐显 */
|
||||
@keyframes fadeInUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* 缩放渐显 */
|
||||
@keyframes scaleIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 🎭 组件设计规范
|
||||
|
||||
### 卡片（Card）
|
||||
|
||||
```css
|
||||
/* 默认卡片 */
|
||||
.heritage-card {
|
||||
border-radius: 12px;
|
||||
border: 1px solid #E8E3DB;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.heritage-card:hover {
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
|
||||
border-color: #C8363D;
|
||||
}
|
||||
```
|
||||
|
||||
### 按钮（Button）
|
||||
|
||||
```css
|
||||
/* 主按钮 */
|
||||
.btn-primary {
|
||||
background: #C8363D;
|
||||
color: #FFFFFF;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 10px 24px;
|
||||
font-weight: 500;
|
||||
box-shadow: 0 2px 0 rgba(200, 54, 61, 0.1);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: #A82E34;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(200, 54, 61, 0.3);
|
||||
}
|
||||
```
|
||||
|
||||
### 标签（Tag）
|
||||
|
||||
```css
|
||||
.heritage-tag {
|
||||
background-color: #F5F0E8;
|
||||
color: #666666;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding: 2px 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
```
|
||||
|
||||
## 📱 响应式断点
|
||||
|
||||
```css
|
||||
/* 移动设备 */
|
||||
@media (max-width: 576px) { ... }
|
||||
|
||||
/* 平板 */
|
||||
@media (max-width: 768px) { ... }
|
||||
|
||||
/* 小屏桌面 */
|
||||
@media (max-width: 992px) { ... }
|
||||
|
||||
/* 中屏桌面 */
|
||||
@media (max-width: 1200px) { ... }
|
||||
|
||||
/* 大屏桌面 */
|
||||
@media (min-width: 1200px) { ... }
|
||||
```
|
||||
|
||||
## 🖼️ 图片使用规范
|
||||
|
||||
### 图片比例
|
||||
|
||||
- **Hero Banner**: 16:9
|
||||
- **卡片封面**: 3:2
|
||||
- **传承人头像**: 1:1
|
||||
- **作品展示**: 4:3
|
||||
|
||||
### 图片优化
|
||||
|
||||
- 使用 WebP 格式（提供 JPG/PNG 降级）
|
||||
- 图片压缩（质量 80-85%）
|
||||
- 懒加载（Lazy Loading）
|
||||
- 响应式图片（`srcset`、`sizes`）
|
||||
|
||||
### 占位图
|
||||
|
||||
使用 Unsplash 或 Pexels 作为开发阶段图片源：
|
||||
- Unsplash: `https://images.unsplash.com/photo-{id}?w={width}`
|
||||
- Pexels: `https://images.pexels.com/photos/{id}/{filename}?w={width}`
|
||||
|
||||
## ♿ 可访问性
|
||||
|
||||
### 颜色对比度
|
||||
|
||||
- 文本与背景对比度 >= 4.5:1
|
||||
- 大文本（18px+）对比度 >= 3:1
|
||||
|
||||
### 键盘导航
|
||||
|
||||
- 所有交互元素支持键盘访问
|
||||
- 清晰的焦点状态（`:focus`）
|
||||
- 逻辑的 Tab 顺序
|
||||
|
||||
### 语义化 HTML
|
||||
|
||||
- 使用正确的 HTML5 语义标签
|
||||
- 添加 ARIA 属性
|
||||
- 为图片添加 alt 文本
|
||||
|
||||
## 🔍 SEO 优化
|
||||
|
||||
- 合理的标题层级（h1-h6）
|
||||
- Meta 标签完整
|
||||
- 结构化数据（JSON-LD）
|
||||
- 友好的 URL 结构
|
||||
|
||||
## 📦 设计资源
|
||||
|
||||
### 设计工具
|
||||
|
||||
- Figma / Sketch - UI 设计
|
||||
- Adobe Illustrator - 图标设计
|
||||
- Adobe Photoshop - 图片处理
|
||||
|
||||
### 图标库
|
||||
|
||||
- Ant Design Icons
|
||||
- 自定义非遗主题图标
|
||||
|
||||
### 字体资源
|
||||
|
||||
- Google Fonts - Noto Serif SC
|
||||
- Google Fonts - Noto Sans SC
|
||||
|
||||
---
|
||||
|
||||
*设计规范持续更新中，如有疑问请联系设计团队*
|
||||
231
README.md
Normal file
231
README.md
Normal file
@ -0,0 +1,231 @@
|
||||
# 非遗文化传承平台
|
||||
|
||||
> 让千年技艺重焕新生，用数字科技守护文化根脉
|
||||
|
||||
一个基于 React 18 + Ant Design 5 的中国非物质文化遗产数字化传承与推广平台。
|
||||
|
||||
## 📋 项目概述
|
||||
|
||||
**项目定位：** 中国非物质文化遗产数字化传承与推广平台，面向文化爱好者、研究者、教育工作者及公众，打造集展示、学习、互动、传播于一体的综合性文化平台。
|
||||
|
||||
**核心价值：**
|
||||
- 🏛️ **传承千年** - 保护和传承中华民族优秀传统文化
|
||||
- 🎨 **匠心独运** - 展现非遗项目的精湛技艺和艺术价值
|
||||
- 🌱 **活态传承** - 让非遗文化在当代社会焕发新生命力
|
||||
|
||||
## ✨ 功能特性
|
||||
|
||||
### 核心功能模块
|
||||
|
||||
- **非遗项目展示**
|
||||
- 分类浏览（传统技艺、传统美术、传统音乐、传统戏剧等）
|
||||
- 详细介绍（历史渊源、技艺特点、文化意义）
|
||||
- 多媒体展示（图片、视频、虚拟展馆）
|
||||
|
||||
- **传承人档案**
|
||||
- 代表性传承人资料库
|
||||
- 个人简介、代表作品、技艺展示
|
||||
- 荣誉成就、学习路径
|
||||
|
||||
- **互动体验**
|
||||
- 在线课程学习
|
||||
- 虚拟展馆（360° 全景）
|
||||
- 线下工坊预约
|
||||
- 非遗时间轴
|
||||
|
||||
- **活动资讯**
|
||||
- 展览活动信息
|
||||
- 行业动态新闻
|
||||
- 政策法规解读
|
||||
|
||||
## 🎨 设计系统
|
||||
|
||||
### 视觉主题
|
||||
|
||||
基于中国传统色彩体系设计，采用朱砂红、金沙黄、墨绿、青黛蓝等传统色彩：
|
||||
|
||||
- **主色调**
|
||||
- 朱砂红 `#C8363D` - 象征传统文化的热情与活力
|
||||
- 金沙黄 `#D4A574` - 象征精湛与珍贵
|
||||
- 墨绿 `#2A5E4D` - 象征沉稳与生命力
|
||||
- 青黛蓝 `#4A5F7F` - 象征深邃与智慧
|
||||
|
||||
- **背景色系**
|
||||
- 宣纸色 `#FAFAF8` - 基础背景
|
||||
- 纯白 `#FFFFFF` - 容器背景
|
||||
- 浅米黄 `#F5F0E8` - 布局背景
|
||||
|
||||
- **字体系统**
|
||||
- 标题：思源宋体 / Noto Serif SC（衬线）
|
||||
- 正文：思源黑体 / Noto Sans SC（无衬线）
|
||||
|
||||
### 组件定制
|
||||
|
||||
完整覆盖 Ant Design 全组件族的主题定制，包括：
|
||||
- 通用组件：Button、Icon、Typography
|
||||
- 布局组件：Layout、Grid、Space
|
||||
- 导航组件：Menu、Breadcrumb、Tabs、Pagination
|
||||
- 数据录入：Input、Select、Form、Upload
|
||||
- 数据展示：Card、Table、Carousel、Tag
|
||||
- 反馈组件：Modal、Message、Notification
|
||||
|
||||
## 🚀 技术栈
|
||||
|
||||
- **前端框架：** React 18.3
|
||||
- **UI 组件库：** Ant Design 5.15
|
||||
- **路由：** React Router 6.22
|
||||
- **状态管理：** Zustand 4.5
|
||||
- **构建工具：** Vite 5.1
|
||||
- **语言：** TypeScript 5.3
|
||||
- **动画：** Framer Motion 11.0
|
||||
|
||||
## 📦 项目结构
|
||||
|
||||
```
|
||||
heritage-ui/
|
||||
├── public/ # 静态资源
|
||||
├── src/
|
||||
│ ├── assets/ # 图片、字体等资源
|
||||
│ ├── components/ # 通用业务组件
|
||||
│ │ ├── HeritageCard/ # 非遗项目卡片
|
||||
│ │ └── InheritorCard/ # 传承人卡片
|
||||
│ ├── layout/ # 布局组件
|
||||
│ │ ├── Header.tsx # 头部导航
|
||||
│ │ ├── Footer.tsx # 页脚
|
||||
│ │ └── MainLayout.tsx # 主布局
|
||||
│ ├── pages/ # 页面组件
|
||||
│ │ ├── Home/ # 首页
|
||||
│ │ ├── Heritage/ # 非遗项目
|
||||
│ │ ├── Inheritors/ # 传承人
|
||||
│ │ └── About/ # 关于我们
|
||||
│ ├── router/ # 路由配置
|
||||
│ ├── services/ # API 服务层
|
||||
│ │ ├── api.ts # API 接口
|
||||
│ │ └── mockData.ts # Mock 数据
|
||||
│ ├── styles/ # 全局样式
|
||||
│ │ └── global.css # 全局 CSS
|
||||
│ ├── theme/ # 主题配置
|
||||
│ │ ├── tokens.ts # Token 配置
|
||||
│ │ ├── components.ts # 组件样式
|
||||
│ │ └── index.ts # 主题入口
|
||||
│ ├── types/ # TypeScript 类型定义
|
||||
│ ├── utils/ # 工具函数
|
||||
│ ├── App.tsx # 根组件
|
||||
│ └── main.tsx # 入口文件
|
||||
├── index.html
|
||||
├── package.json
|
||||
├── tsconfig.json
|
||||
├── vite.config.ts
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## 🛠️ 开始使用
|
||||
|
||||
### 环境要求
|
||||
|
||||
- Node.js >= 16.0.0
|
||||
- npm >= 8.0.0 或 yarn >= 1.22.0
|
||||
|
||||
### 安装依赖
|
||||
|
||||
```bash
|
||||
# 使用 npm
|
||||
npm install
|
||||
|
||||
# 或使用 yarn
|
||||
yarn install
|
||||
```
|
||||
|
||||
### 开发模式
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
访问 http://localhost:3001
|
||||
|
||||
### 生产构建
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
### 预览构建结果
|
||||
|
||||
```bash
|
||||
npm run preview
|
||||
```
|
||||
|
||||
## 📊 数据管理
|
||||
|
||||
当前版本使用 Mock 数据进行开发演示，数据文件位于 `src/services/mockData.ts`。
|
||||
|
||||
### 接入真实后端
|
||||
|
||||
修改 `src/services/api.ts` 中的接口实现，替换为真实的 API 调用：
|
||||
|
||||
```typescript
|
||||
// 示例：替换 Mock 数据为真实 API
|
||||
export const getHeritageList = async (params) => {
|
||||
const response = await fetch('/api/heritage/list', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(params)
|
||||
})
|
||||
return response.json()
|
||||
}
|
||||
```
|
||||
|
||||
## 🎯 开发规范
|
||||
|
||||
### 代码风格
|
||||
|
||||
- 组件命名：PascalCase
|
||||
- 文件命名：PascalCase（组件）、camelCase（工具函数）
|
||||
- CSS 类名：kebab-case
|
||||
- 类型定义：统一在 `src/types/index.ts` 中管理
|
||||
|
||||
### 提交规范
|
||||
|
||||
```
|
||||
feat: 新功能
|
||||
fix: 修复 bug
|
||||
docs: 文档更新
|
||||
style: 代码格式调整
|
||||
refactor: 重构
|
||||
perf: 性能优化
|
||||
test: 测试相关
|
||||
chore: 构建/工具链相关
|
||||
```
|
||||
|
||||
## 🔮 后续优化方向
|
||||
|
||||
- [ ] 完善非遗项目详情页
|
||||
- [ ] 完善传承人详情页
|
||||
- [ ] 实现在线学习模块
|
||||
- [ ] 实现虚拟展馆（WebGL / Three.js）
|
||||
- [ ] 添加用户系统（登录、收藏、评论）
|
||||
- [ ] 实现搜索功能（全文检索）
|
||||
- [ ] 添加数据可视化（图表、地图）
|
||||
- [ ] 移动端适配优化
|
||||
- [ ] PWA 支持
|
||||
- [ ] 性能优化（懒加载、代码分割）
|
||||
- [ ] SEO 优化（SSR / SSG）
|
||||
- [ ] 国际化支持（i18n）
|
||||
|
||||
## 📄 许可证
|
||||
|
||||
MIT License
|
||||
|
||||
## 🤝 贡献指南
|
||||
|
||||
欢迎提交 Issue 和 Pull Request！
|
||||
|
||||
---
|
||||
|
||||
**联系我们**
|
||||
|
||||
- 邮箱：heritage@example.com
|
||||
- 电话：400-123-4567
|
||||
- 地址：北京市朝阳区文化创意产业园
|
||||
|
||||
让我们一起守护中华文化根脉！
|
||||
15
index.html
Normal file
15
index.html
Normal file
@ -0,0 +1,15 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content="中国非物质文化遗产数字化传承与推广平台 - 让千年技艺重焕新生" />
|
||||
<meta name="keywords" content="非遗,非物质文化遗产,传统文化,文化传承,匠心,民间艺术" />
|
||||
<title>非遗传承 - 守护千年文化根脉</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
4570
package-lock.json
generated
Normal file
4570
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
35
package.json
Normal file
35
package.json
Normal file
@ -0,0 +1,35 @@
|
||||
{
|
||||
"name": "heritage-ui",
|
||||
"private": true,
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"description": "中国非物质文化遗产数字化传承与推广平台",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"preview": "vite preview",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"react-router-dom": "^6.22.0",
|
||||
"antd": "^5.15.0",
|
||||
"@ant-design/icons": "^5.3.0",
|
||||
"dayjs": "^1.11.10",
|
||||
"framer-motion": "^11.0.5",
|
||||
"zustand": "^4.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.3.1",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@typescript-eslint/eslint-plugin": "^7.0.0",
|
||||
"@typescript-eslint/parser": "^7.0.0",
|
||||
"@vitejs/plugin-react": "^4.2.1",
|
||||
"eslint": "^8.56.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.5",
|
||||
"typescript": "^5.3.3",
|
||||
"vite": "^5.1.0"
|
||||
}
|
||||
}
|
||||
42
tsconfig.json
Normal file
42
tsconfig.json
Normal file
@ -0,0 +1,42 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
|
||||
/* Path Mapping */
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["src/*"],
|
||||
"@components/*": ["src/components/*"],
|
||||
"@pages/*": ["src/pages/*"],
|
||||
"@layout/*": ["src/layout/*"],
|
||||
"@theme/*": ["src/theme/*"],
|
||||
"@services/*": ["src/services/*"],
|
||||
"@store/*": ["src/store/*"],
|
||||
"@hooks/*": ["src/hooks/*"],
|
||||
"@utils/*": ["src/utils/*"],
|
||||
"@assets/*": ["src/assets/*"],
|
||||
"@styles/*": ["src/styles/*"],
|
||||
"@types/*": ["src/types/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
10
tsconfig.node.json
Normal file
10
tsconfig.node.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
40
vite.config.ts
Normal file
40
vite.config.ts
Normal file
@ -0,0 +1,40 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import path from 'path'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, './src'),
|
||||
'@components': path.resolve(__dirname, './src/components'),
|
||||
'@pages': path.resolve(__dirname, './src/pages'),
|
||||
'@layout': path.resolve(__dirname, './src/layout'),
|
||||
'@theme': path.resolve(__dirname, './src/theme'),
|
||||
'@services': path.resolve(__dirname, './src/services'),
|
||||
'@store': path.resolve(__dirname, './src/store'),
|
||||
'@hooks': path.resolve(__dirname, './src/hooks'),
|
||||
'@utils': path.resolve(__dirname, './src/utils'),
|
||||
'@assets': path.resolve(__dirname, './src/assets'),
|
||||
'@styles': path.resolve(__dirname, './src/styles'),
|
||||
'@types': path.resolve(__dirname, './src/types'),
|
||||
}
|
||||
},
|
||||
server: {
|
||||
port: 3001,
|
||||
open: true
|
||||
},
|
||||
build: {
|
||||
outDir: 'dist',
|
||||
sourcemap: false,
|
||||
rollupOptions: {
|
||||
output: {
|
||||
manualChunks: {
|
||||
'react-vendor': ['react', 'react-dom', 'react-router-dom'],
|
||||
'antd-vendor': ['antd', '@ant-design/icons'],
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user