菜单
Project structure and file organization for divine-web. Load when creating new files, moving code, or navigating the codebase.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | project-structure |
| description | Project structure and file organization for divine-web. Load when creating new files, moving code, or navigating the codebase. |
src/ is the application root.
src/components/: reusable UI components. PascalCase filenames matching the
component name (e.g. VideoCard.tsx).src/pages/: route-level page components. *Page.tsx naming (e.g.
HomePage.tsx, ProfilePage.tsx).src/hooks/: custom React hooks. useX naming in .ts files (e.g.
useNostr.ts).src/lib/: utilities, helpers, non-React logic.src/contexts/: React context providers and their associated hooks.src/types/: shared TypeScript type definitions and interfaces.src/test/: test setup (setup.ts) and shared test utilities.src/config/: runtime configuration and constants.src/data/: static data files and fixtures.src/styles/: global CSS and style definitions beyond Tailwind utilities.index.html → src/main.tsx → src/App.tsx → src/AppRouter.tsx
@/ maps to src/. Configured in tsconfig.json paths and vite.config.ts
resolve.alias. Use @/ for all app imports.
public/ holds static assets served as-is: manifest.webmanifest,
_redirects, and other files that don't need processing.
dist/ receives the production build. During build, index.html is copied to
404.html to support SPA routing on static hosts.
| File | Purpose |
|---|---|
vite.config.ts | Vite build configuration |
tailwind.config.ts | TailwindCSS configuration |
eslint.config.js | ESLint configuration |
tsconfig.json | Root TypeScript config |
tsconfig.app.json | App source TypeScript config |
tsconfig.node.json | Node/tooling TypeScript config |
eslint-rules/ contains project-specific rules: no-inline-script,
no-placeholder-comments, require-webmanifest. No inline eslint-disable
comments.
scripts/ holds build and utility scripts:
copy-well-known.mjs / verify-well-known.mjs: handle .well-known filesprerender-legal.mjs: prerender legal pagesgenerate-icons.js: generate app iconsprecalculate-hashtag-thumbnails.ts: precompute thumbnail dataverify-relay-config.ts: validate relay configurationaudit-microcopy.mjs / a11y-audit.mjs: content and accessibility auditsdocs/ contains project documentation:
docs/brand/: brand guidelines and assetsdocs/superpowers/plans/: implementation plansdocs/superpowers/specs/: feature specificationsdocs/ root: architecture docs, relay docs, migration guides| Adding a... | Put it in... | Named... |
|---|---|---|
| New page | src/pages/ | FooPage.tsx |
| New component | src/components/ | Foo.tsx |
| New hook | src/hooks/ | useFoo.ts |
| New utility | src/lib/ | foo.ts |
| New context | src/contexts/ | FooContext.tsx |
| New type | src/types/ | foo.ts |
| New test | Next to source | foo.test.ts or foo.test.tsx |
Install Cloudflare skills and MCP servers for this agent. Load when you need to set up or verify Cloudflare agent tooling. The URL below is the canonical, always-current source of truth.
Coding style and naming conventions for divine-web. Load when writing or editing TypeScript, React components, hooks, or styles.
Commit and pull request conventions for divine-web. Load when creating commits, writing PR descriptions, or preparing branches for review.
Render a page component directly at subdomain root (/) without URL redirect in React Router SPAs. Use when: (1) Subdomain should show content at / instead of redirecting to /profile/id or similar, (2) User sees blank page because component relies on useParams() but there's no route param at /, (3) Want username.domain.com/ to feel like a personal website without /profile/xyz in the URL. Pattern involves edge-injected global data + component fallback to that data when route params missing.
Testing conventions for divine-web. Load when writing or modifying tests, or when verifying changes with Vitest or Playwright.