corp-mp/CLAUDE.md

CLAUDE.md

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

corp-mp is a Taro 4.2 cross-platform app (React 18 + TypeScript + SCSS, compiled with Vite). The primary target is the WeChat mini-program (weapp); Taro also compiles it to H5, Alipay, Swan, TT, QQ, JD, RN, and Harmony.

Commands

Package manager is pnpm (a pnpm-lock.yaml is committed).

pnpm install            # install deps
pnpm dev:weapp          # WeChat mini-program dev build with --watch → ./dist
pnpm build:weapp        # production mini-program build → ./dist
pnpm dev:h5 / build:h5  # H5 target

Other targets follow pnpm dev:<platform> / pnpm build:<platform> (alipay, swan, tt, qq, jd, rn, harmony-hybrid).

Running the mini-program: builds output to ./dist. Open ./dist in WeChat DevTools (project.config.json already points miniprogramRoot there; appId wx6d4f6f29c41aff93).

There is no test runner and no lint script in package.json. ESLint (taro/react) and Stylelint are configured but run manually. The only enforced gate is a Husky commit-msg hook running commitlint (Conventional Commits) — non-conforming commit messages are rejected.

Architecture

The app is a thin native shell around a business H5, with a native payment bridge. Two pages, registered in src/app.config.ts:

1. pages/index/index.tsx — auth + WebView host. On load it calls Taro.login() to get the WeChat code, then renders a full-screen <WebView> pointing at the business H5 (http://niubsw.com/...?mpCode=<code>). All business UI lives in that remote H5, not in this repo.

2. pages/pay/index.tsx — native payment bridge. The H5 cannot invoke WeChat JSAPI pay while running inside the mini-program WebView, so it hands off to this native page. The handoff contract:

• The H5 detects it's inside the mini-program and calls wxSdk.miniProgram.navigateTo({ url: '/pages/pay/index?order=<b64>&formInfo=<b64>' }).
• Params are base64-encoded JSON, produced H5-side by utf8ToBase64(v) = btoa(unescape(encodeURIComponent(JSON.stringify(v)))).
• order already contains the complete WeChat JSAPI fields (timeStamp/nonceStr/package/signType/paySign). The page decodes it, auto-fires Taro.requestPayment, then navigateBack()s to the H5 on success. No backend call is made here.
• temp.txt (repo root) holds the H5-side snippet documenting this contract — keep the two sides in sync.

src/utils/base64.ts is the strict inverse of the H5 encoder. It hand-rolls a base64 decoder because weapp has no global atob, and normalizes +→space mangling from URL routing. Reuse decodeOrderParam<T>(raw) for any future base64 route params.

Conventions

• Page = folder under src/pages/<name>/ with index.tsx + index.scss + index.config.ts. New pages must be added to the pages array in src/app.config.ts or they won't route.
• Lifecycle: use Taro hooks — useLoad for page init (reads route params via Taro.getCurrentInstance().router?.params), useLaunch for app init — not bare useEffect.
• Native API calls must be env-guarded: wrap weapp-only APIs (e.g. Taro.requestPayment) in if (Taro.getEnv() === Taro.ENV_TYPE.WEAPP) with a fallback branch for other targets.
• Styling: SCSS with BEM (block__element--modifier); CSS Modules are disabled. Design width is 750, so author dimensions in px — Taro converts to rpx/rem at compile time.
• Imports: @/* is aliased to src/* (see tsconfig.json).
• strictNullChecks, noUnusedLocals, and noUnusedParameters are on; noImplicitAny is off.

A more verbose Chinese-language version of these notes lives in GEMINI.md.