classroom-music-activation/CLAUDE.md

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Project Overview

This is a WeChat Mini Program (微信小程序) for music digital education activation, allowing users to purchase music course subscriptions and instruments.

Development Commands

Build npm packages

# WeChat Developer Tools: Tools > Build npm
# Or via CLI equivalent in project.config.json packNpmManually settings

Environment Switching

Edit miniprogram/config.ts to change environment:

const environmentVariable = "online"; // "dev" | "test" | "online"

WeChat Developer Tools

• Open project in WeChat Developer Tools
• Project uses TypeScript and Less compilers (configured in project.config.json)
• miniprogram/ is the source root

Architecture

Directory Structure

miniprogram/
├── api/           # API request functions (login.ts, new.ts)
├── components/    # Reusable components (navigation-bar, service, apply-refound)
├── pages/         # Page modules (index, login, orders, protocol, download, buyerInformation)
├── plugins/       # Request plugin for HTTP calls
├── utils/         # Utilities (EventBus, util, qrcode)
├── app.ts         # App entry with global state
├── app.json       # Page routes and global config
├── config.ts      # Environment-based API URLs

Key Patterns

Request Layer: plugins/request.ts handles all API calls with:

• Automatic token injection from wx.getStorageSync("token")
• Open APIs (/open/, /code/) skip token requirement
• Error code handling with login redirect on 5000/403
• Form data, JSON, and multipart content types

Global State: app.ts manages:

• globalData.baseUrl - API base URL from config.ts
• globalData.appId - WeChat Mini Program AppID
• globalData.isLogin - Login status
• globalData.userInfo - User profile

Pages: Each page follows WeChat Mini Program structure:

• .ts - Page logic with Page({...})
• .wxml - Template markup
• .less - Styles
• .json - Page config (usingComponents, etc.)

Components: Custom components using Component({...}):

• navigation-bar - Custom header with safe area handling
• service - Customer service floating button
• apply-refound - Refund application modal

EventBus: utils/EventBus.ts provides simple pub/sub for cross-component communication.

API Endpoints

All APIs under /edu-app/ prefix:

• Authentication: /userlogin, /user/getUserInfo
• Products: /open/shop/product, /open/shop/instruments
• Orders: /userPaymentOrder/* (executeOrder, detail, refund, etc.)
• Address: /userReceiveAddress/*
• Beneficiary: /userBeneficiary/*

UI Framework

Uses Vant Weapp (@vant/weapp) component library. Components registered in page .json files.

TypeScript Configuration

Strict mode enabled with:

• noImplicitAny, strictNullChecks, strict
• Target: ES2020
• Type definitions in typings/