# report-project

**Repository Path**: alibi-jia/report-project

## Basic Information

- **Project Name**: report-project
- **Description**: 报表框架基本选型
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-10-09
- **Last Updated**: 2025-10-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README


# 低代码报表引擎

本项目基于公司低代码引擎（[阿里 lowcodeEngine](https://lowcode-engine.cn/index)），用于已有数据源和数据配置的可视化报表展示。

---

## 技术栈

项目技术栈选型理由：

1. 重复利用公司现有模块联邦
2. 客户端渲染（CSR）为主
3. 响应式布局：移动端优先设计
4. DX 体验：TypeScript
5. 原子化样式：快速样式成型，降低维护成本

主要依赖：

- **rsbuild**：基于 `rspack` 的构建工具，Webpack 平替
- **@tanstack/react-router**：类型提示优秀的路由解决方案，[官方文档](https://tanstack.com/router/latest)
- **@tanstack/query**：请求工具库，支持接口缓存、防抖，[官方文档](https://tanstack.com/query/latest)
- **tailwindcss**：原子化 CSS，[官方文档](https://tailwindcss.com/)
- **gridstack & react-grid-layout**：报表布局设计用 React 工具库，[官方文档](https://gridstackjs.com/)
- **@coreland/ky**: 公司请求工具,单纯发起请求用


- **@reactuses/core & usehooks-ts**：React 生态下的 Hook 工具集
- **radash**：lodash/lodash-es 平替，[官方文档](https://radash.uihtm.com/)


---

## 项目预览 & 部署

### 安装依赖

首次下载项目请执行：

```bash
pnpm install
```

如遇依赖问题或包缺失，可再次执行上述命令。

### 启动开发环境

在项目根目录下执行：

```bash
pnpm dev
```

根据提示访问本地地址即可预览项目。

### 构建与部署

项目构建命令：

```bash
pnpm build
```

构建完成后，根目录会生成 `dist` 目录，内容可直接用于静态部署，无需服务端运行时。


**运维提示**

需要代理以`/api` 开头的所有接口到指定的服务器


---

## 目录结构

```text
.
├── README.md                      项目说明文档
├── package.json                   项目依赖与脚本
├── pnpm-lock.yaml                 pnpm 依赖锁定
├── postcss.config.mjs             rspack 解析 tailwindcss 配置
├── public/                        静态资源，构建后原样复制
├── rsbuild.config.ts              rsbuild 构建配置
├── src/
│   ├── env.d.ts                   环境类型声明
│   ├── global.css                 全局样式及关键配置
│   ├── main.tsx                   应用入口
│   ├── routeTree.gen.ts           路由类型自动生成文件（勿手动修改）
│   └── routes/                    页面与业务代码
│       ├── (pathless)/            非路由页面
│       ├── __root.tsx             路由根节点
│       ├── about.tsx              关于页面
│       ├── index.tsx              首页
│       ├── layout/                路由布局相关
│       └── resizable/             可拖拽/缩放相关组件
├── tailwind.config.mjs            tailwindcss 配置（兼容 heroui UI 库）
└── tsconfig.json                  TypeScript 配置
```