# starpro

**Repository Path**: nofree5th/starpro

## Basic Information

- **Project Name**: starpro
- **Description**: 技能五子棋Pro
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-23
- **Last Updated**: 2026-05-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 技能五子棋 Pro - 微信小游戏版

一个基于纯原生 JavaScript 开发的技能五子棋游戏，支持微信小游戏环境。

## 游戏规则

- **基础规则**：经典五子棋规则，五子连珠获胜
- **特殊机制**：
  - 允许各种"技能"操作（移动棋子、销毁棋子、覆盖等）
  - 但如果被对方举报并答对成语题，则违规操作会被回滚并获得黄牌
  - 累计 5 张黄牌判负
  - 可以虚假宣告胜利（诈胡），对方有 5 秒时间举报

## 操作说明

- **点击空位**：落子
- **点击棋子 > 1.5秒**：销毁棋子
- **拖动棋子**：移动棋子
- **点击已有棋子的位置**：覆盖棋子
- **宣告胜利**：宣告自己获胜（可以虚假宣告）
- **举报**：举报对方违规操作

## 📚 文档

- [快速开始](./doc/快速开始.md) - 项目入门指南
- [多人对战快速开始](./doc/多人对战快速开始.md) - 多人对战功能使用
- [微信小游戏部署指南](./doc/微信小游戏部署指南.md) - 部署说明
- [更多文档](./doc/README.md) - 完整文档目录

## 项目结构

```
starpro/
├── libs/                   # 微信小游戏适配器（不要修改）
│   └── weapp-adapter/      # DOM/Canvas/Audio 等 API 适配
├── src/                    # 源代码
│   ├── constants.js        # 游戏常量
│   ├── GameState.js        # 游戏状态管理
│   ├── main.js            # 主入口（引入 weapp-adapter）
│   ├── services/          # 服务层
│   │   ├── audioService.js
│   │   ├── gameLogic.js
│   │   ├── GameServer.js  # 游戏服务器（多人对战）
│   │   └── DataBus.js     # 数据总线
│   ├── scenes/            # 场景层
│   │   ├── HomeScene.js   # 主菜单场景
│   │   └── RoomScene.js   # 房间场景
│   ├── ui/                # UI 层
│   │   ├── GameBoard.js   # Canvas 棋盘渲染
│   │   └── CanvasUI.js    # Canvas UI 管理
│   └── utils/             # 工具函数
│       └── platform.js
├── dist/                  # 构建产物（微信小游戏项目根目录）
│   ├── miniprogram/      # 小程序前端代码
│   └── cloudfunction/    # 云函数代码
│   ├── index.html
│   ├── game.js
│   └── game.json
├── doc/                   # 项目文档
│   ├── README.md          # 文档索引
│   ├── 快速开始.md
│   ├── 多人对战快速开始.md
│   ├── 多人对战使用说明.md
│   └── ...
├── webpack.config.js      # Webpack 配置
├── package.json
├── game.json             # 小游戏配置
├── CHANGELOG.md          # 更新日志
└── project.config.json   # 微信开发者工具配置
```

## 开发指南

### 安装依赖

```bash
npm install
```

### 本地开发

```bash
npm run dev
```

访问 http://localhost:8080 即可在浏览器中预览游戏。

### 构建微信小游戏

```bash
npm run build
```

构建完成后，`dist/` 目录即为微信小游戏的项目根目录。

### 微信小游戏调试

1. 使用微信开发者工具打开 `dist/` 目录
2. 开发者工具会自动识别 `project.config.json`
3. 前端代码在 `dist/miniprogram/` 目录
4. 云函数代码在 `dist/cloudfunction/` 目录
5. 运行 `npm run build` 后即可在开发者工具中预览

## 技术栈

- **纯原生 JavaScript**（ES6+）
- **Canvas 2D API**（游戏渲染）
- **Web Audio API**（音效）
- **Webpack**（模块打包）
- **Tailwind CSS**（样式，通过 CDN 引入）

## 微信小游戏适配

项目通过以下方式实现微信小游戏适配：

### 1. weapp-adapter 适配器

位于 `libs/weapp-adapter/` 目录，提供了完整的 DOM/Canvas/Audio API 模拟：

- `document`、`window` 全局对象
- `Canvas` 和 `CanvasRenderingContext2D`
- `HTMLElement`、`HTMLCanvasElement` 等 DOM 元素
- `Audio`、`Image` 等媒体对象
- 事件系统（`addEventListener`、`Event` 等）

**注意：请勿修改 `libs/weapp-adapter/` 中的任何代码！**

### 2. 平台检测（src/utils/platform.js）

- `isWeChat`：判断是否在微信环境
- `createAudioContext()`：创建音频上下文（微信/浏览器）
- `getPixelRatio()`：获取设备像素比
- `getScreenSize()`：获取屏幕尺寸

在微信小游戏环境中，会自动使用 `wx` 全局对象的相关 API。

## 特性

- ✅ 完全使用原生 JavaScript，无 React/Vue 依赖
- ✅ 使用 Webpack 打包，支持 ES6+ 语法
- ✅ Canvas 渲染，高性能
- ✅ 跨平台适配（浏览器 + 微信小游戏）
- ✅ 保留原有游戏逻辑和交互
- ✅ 响应式设计，支持移动端
- ✅ 支持多人在线对战（房间服务 + 帧同步）

## 更新日志

查看 [CHANGELOG.md](./CHANGELOG.md) 了解版本更新历史。

## 许可证

MIT