# react-esbuild-template

**Repository Path**: buera/react-esbuild-template

## Basic Information

- **Project Name**: react-esbuild-template
- **Description**: 基于 React + TypeScript + esbuild 的快速开发模板。
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-12
- **Last Updated**: 2026-09-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React esbuild 模板

基于 React + TypeScript + esbuild 的快速开发模板。

## 特性

- ⚡️ **高性能构建**：使用 esbuild 作为构建工具，速度极快
- 🦾 **TypeScript 支持**：完整的 TypeScript 类型支持
- 🎨 **Less 预处理器**：支持 Less CSS 预处理器
- 🔥 **热更新**：开发服务器支持实时热更新
- 📦 **资源处理**：内置图片、字体、SVG 等资源加载器
- 🛣️ **路由支持**：集成 React Router 路由管理

## 项目结构

```
├── config/                  # 构建配置
│   ├── plugin/             # 自定义 esbuild 插件
│   │   ├── copy-loader.ts
│   │   ├── font-loader.ts
│   │   ├── image.loader.ts
│   │   ├── less.loader.ts
│   │   ├── static-loader.ts
│   │   └── tsql-loader.ts
│   ├── esbuild.common.ts   # 通用配置
│   ├── esbuild.dev.ts      # 开发环境配置
│   ├── esbuild.prod.ts     # 生产环境配置
│   └── proxy.ts            # 代理配置
├── public/                  # 静态公共资源
│   └── index.html
├── src/                     # 源代码
│   ├── assets/            # 静态资源
│   ├── views/             # 页面组件
│   ├── router/            # 路由配置
│   ├── contextProvider.tsx
│   ├── App.tsx
│   └── index.tsx
├── server.ts               # 开发服务器
├── esbuild.config.ts       # esbuild 入口配置
├── config.ts               # 项目配置
└── tsconfig.json           # TypeScript 配置
```

## 快速开始

### 安装依赖

```bash
npm install
```

### 开发模式

启动开发服务器，支持热更新：

```bash
npm run dev
```

### 生产构建

构建生产环境产物：

```bash
npm run build
```

## 配置说明

### 代理配置

在 `config/proxy.ts` 中配置开发环境的代理规则。

### 环境变量

- `NODE_ENV`：环境模式（development/production）

## 技术栈

- React 18
- TypeScript
- esbuild
- Less
- React Router

## 许可证

MIT License