diff --git a/.roo/rules/rules.md b/.roo/rules/rules.md index d3795393f3..9918bd68fd 100644 --- a/.roo/rules/rules.md +++ b/.roo/rules/rules.md @@ -1,21 +1,72 @@ -# Code Quality Rules +# Roo Code Development Guide -1. Test Coverage: +## Build & Test Commands - - Before attempting completion, always make sure that any code changes have test coverage - - Ensure all tests pass before submitting changes - - The vitest framework is used for testing; the `describe`, `test`, `it`, etc functions are defined by default in `tsconfig.json` and therefore don't need to be imported - - Tests must be run from the same directory as the `package.json` file that specifies `vitest` in `devDependencies` +```bash +pnpm install # Install dependencies +pnpm test # Run all tests +pnpm lint # Run ESLint +pnpm check-types # TypeScript type checking +pnpm build # Build the project +pnpm format # Format code with Prettier -2. Lint Rules: +# Run a single test file (from src/ directory) +pnpm test path/to/test.spec.ts +``` - - Never disable any lint rules without explicit user approval +## Code Style Guidelines -3. Styling Guidelines: - - Use Tailwind CSS classes instead of inline style objects for new markup - - VSCode CSS variables must be added to webview-ui/src/index.css before using them in Tailwind classes - - Example: `
` instead of style objects +- **TypeScript**: Strict mode enabled, use explicit types +- **Testing**: Vitest with globals, no imports needed for `describe`, `test`, `it` +- **Linting**: ESLint with TypeScript rules, never disable without approval +- **Formatting**: Prettier for consistent code style +- **Imports**: Use relative paths, organize by external/internal/types +- **Naming**: camelCase for variables/functions, PascalCase for types/classes +- **Files**: kebab-case for filenames, `.test.ts` or `.spec.ts` for tests -# Adding a New Setting +## UI Development -To add a new setting that persists its state, follow the steps in docs/settings.md +- Use Tailwind CSS classes instead of inline styles +- VSCode CSS variables go in `webview-ui/src/index.css` +- Example: `
` + +## Error Handling + +- Use try-catch for async operations +- Log errors with context using the logger utility +- Provide meaningful error messages to users + +## Testing Requirements + +- All code changes must have test coverage +- Run tests from the directory containing package.json +- Tests use mocks in `src/__mocks__/` for VSCode APIs + +## Monorepo Structure + +This is a pnpm workspace monorepo using Turbo for build orchestration: + +### Main Workspaces + +- `/src` - Main VSCode extension code (package: roo-cline) +- `/webview-ui` - React-based UI components (@roo-code/vscode-webview) +- `/apps/` - Additional applications: + - `vscode-e2e` - End-to-end tests using Mocha + - `vscode-nightly` - Nightly build configuration + - `web-docs` - Documentation website + - `web-evals` - Evaluation system web app + - `web-roo-code` - Main website +- `/packages/` - Shared packages: + - `types` - Shared TypeScript types (@roo-code/types) + - `cloud` - Cloud integration utilities + - `telemetry` - Analytics and telemetry + - `config-eslint` - Shared ESLint configuration + - `config-typescript` - Shared TypeScript configuration + - `ipc` - Inter-process communication utilities + +### Key Dependencies + +- Build: Turbo, pnpm workspaces +- Testing: Vitest (unit), Mocha (E2E) +- UI: React 18, Tailwind CSS, Radix UI +- Bundling: Vite (webview), esbuild (extension)