mirror of
https://github.com/Kilo-Org/kilocode.git
synced 2026-08-30 17:14:40 +08:00
fix: replace stale docusaurus files with current next.js/markdoc docs
git filter-repo incorrectly resolved a merge commit where the docs app was migrated from Docusaurus to Next.js + Markdoc, resulting in the old Docusaurus files at HEAD. This commit overlays the correct current files from the source repo (kilo-org/kilocode main branch). Package renamed from kilocode-docs to @kilocode/kilo-docs.
This commit is contained in:
@@ -0,0 +1,6 @@
|
||||
NEXT_PUBLIC_ALGOLIA_APP_ID=ABC123
|
||||
NEXT_PUBLIC_ALGOLIA_API_KEY=zyz6789
|
||||
NEXT_PUBLIC_ALGOLIA_INDEX_NAME="Kilo Code Docs"
|
||||
NEXT_PUBLIC_ALGOLIA_ASSISTANT_ID=foo-bar
|
||||
NEXT_PUBLIC_POSTHOG_KEY=phc_QWERTY
|
||||
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
|
||||
@@ -1,2 +0,0 @@
|
||||
POSTHOG_API_KEY=your_posthog_api_key
|
||||
FREE_TIER_AMOUNT=$7
|
||||
@@ -0,0 +1,3 @@
|
||||
|
||||
# Use bd merge for beads JSONL files
|
||||
.beads/issues.jsonl merge=beads
|
||||
@@ -1,31 +1,10 @@
|
||||
.release-notes/
|
||||
# Dependencies
|
||||
/node_modules
|
||||
|
||||
# Production
|
||||
/build
|
||||
|
||||
# Generated files
|
||||
.docusaurus
|
||||
.cache-loader
|
||||
*.js
|
||||
!src/**/*.js
|
||||
|
||||
# Misc
|
||||
node_modules/
|
||||
.DS_Store
|
||||
.env
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.npmrc
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
.devcontainer
|
||||
TEMP/
|
||||
|
||||
.history/
|
||||
.next/
|
||||
.vercel
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
screenshots/
|
||||
.beads/
|
||||
.env
|
||||
next-env.d.ts
|
||||
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"mcpServers": {
|
||||
"context7": {
|
||||
"command": "npx",
|
||||
"args": ["-y", "@upstash/context7-mcp"],
|
||||
"env": { "DEFAULT_MINIMUM_TOKENS": "" },
|
||||
"alwaysAllow": ["resolve-library-id", "query-docs"],
|
||||
"disabled": true
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,168 +0,0 @@
|
||||
# Memory Bank
|
||||
|
||||
I am an expert software engineer with a unique characteristic: my memory resets completely between sessions. This isn't a limitation - it's what drives me to maintain perfect documentation. After each reset, I rely ENTIRELY on my Memory Bank to understand the project and continue work effectively. I MUST read ALL memory bank files at the start of EVERY task - this is not optional. The memory bank files are located in `.kilocode/rules/memory-bank` folder.
|
||||
|
||||
When I start a task, I will include `[Memory Bank: Active]` at the beginning of my response if I successfully read the memory bank files, or `[Memory Bank: Missing]` if the folder doesn't exist or is empty. If memory bank is missing, I will warn the user about potential issues and suggest initialization.
|
||||
|
||||
## Memory Bank Structure
|
||||
|
||||
The Memory Bank consists of core files and optional context files, all in Markdown format.
|
||||
|
||||
### Core Files (Required)
|
||||
1. `brief.md`
|
||||
This file is created and maintained manually by the developer. Don't edit this file directly but suggest to user to update it if it can be improved.
|
||||
- Foundation document that shapes all other files
|
||||
- Created at project start if it doesn't exist
|
||||
- Defines core requirements and goals
|
||||
- Source of truth for project scope
|
||||
|
||||
2. `product.md`
|
||||
- Why this project exists
|
||||
- Problems it solves
|
||||
- How it should work
|
||||
- User experience goals
|
||||
|
||||
3. `context.md`
|
||||
This file should be short and factual, not creative or speculative.
|
||||
- Current work focus
|
||||
- Recent changes
|
||||
- Next steps
|
||||
|
||||
4. `architecture.md`
|
||||
- System architecture
|
||||
- Source Code paths
|
||||
- Key technical decisions
|
||||
- Design patterns in use
|
||||
- Component relationships
|
||||
- Critical implementation paths
|
||||
|
||||
5. `tech.md`
|
||||
- Technologies used
|
||||
- Development setup
|
||||
- Technical constraints
|
||||
- Dependencies
|
||||
- Tool usage patterns
|
||||
|
||||
### Additional Files
|
||||
Create additional files/folders within memory-bank/ when they help organize:
|
||||
- `tasks.md` - Documentation of repetitive tasks and their workflows
|
||||
- `todos.md` - List of currently active TODOs and missing documentation items. When items are completed, they should be removed from the list
|
||||
- Complex feature documentation
|
||||
- Integration specifications
|
||||
- API documentation
|
||||
- Testing strategies
|
||||
- Deployment procedures
|
||||
|
||||
## Core workflows
|
||||
|
||||
### Memory Bank Initialization
|
||||
|
||||
The initialization step is CRITICALLY IMPORTANT and must be done with extreme thoroughness as it defines all future effectiveness of the Memory Bank. This is the foundation upon which all future interactions will be built.
|
||||
|
||||
When user requests initialization of the memory bank (command `initialize memory bank`), I'll perform an exhaustive analysis of the project, including:
|
||||
- All source code files and their relationships
|
||||
- Configuration files and build system setup
|
||||
- Project structure and organization patterns
|
||||
- Documentation and comments
|
||||
- Dependencies and external integrations
|
||||
- Testing frameworks and patterns
|
||||
|
||||
I must be extremely thorough during initialization, spending extra time and effort to build a comprehensive understanding of the project. A high-quality initialization will dramatically improve all future interactions, while a rushed or incomplete initialization will permanently limit my effectiveness.
|
||||
|
||||
After initialization, I will ask the user to read through the memory bank files and verify product description, used technologies and other information. I should provide a summary of what I've understood about the project to help the user verify the accuracy of the memory bank files. I should encourage the user to correct any misunderstandings or add missing information, as this will significantly improve future interactions.
|
||||
|
||||
### Memory Bank Update
|
||||
|
||||
Memory Bank updates occur when:
|
||||
1. Discovering new project patterns
|
||||
2. After implementing significant changes
|
||||
3. When user explicitly requests with the phrase **update memory bank** (MUST review ALL files)
|
||||
4. When context needs clarification
|
||||
|
||||
If I notice significant changes that should be preserved but the user hasn't explicitly requested an update, I should suggest: "Would you like me to update the memory bank to reflect these changes?"
|
||||
|
||||
To execute Memory Bank update, I will:
|
||||
|
||||
1. Review ALL project files
|
||||
2. Document current state
|
||||
3. Document Insights & Patterns
|
||||
4. If requested with additional context (e.g., "update memory bank using information from @/Makefile"), focus special attention on that source
|
||||
|
||||
Note: When triggered by **update memory bank**, I MUST review every memory bank file, even if some don't require updates. Focus particularly on context.md as it tracks current state.
|
||||
|
||||
### Add Task
|
||||
|
||||
When user completes a repetitive task (like adding support for a new model version) and wants to document it for future reference, they can request: **add task** or **store this as a task**.
|
||||
|
||||
This workflow is designed for repetitive tasks that follow similar patterns and require editing the same files. Examples include:
|
||||
- Adding support for new AI model versions
|
||||
- Implementing new API endpoints following established patterns
|
||||
- Adding new features that follow existing architecture
|
||||
|
||||
Tasks are stored in the file `tasks.md` in the memory bank folder. The file is optional an can be empty. The file can store many tasks.
|
||||
|
||||
To execute Add Task workflow:
|
||||
|
||||
1. Create or update `tasks.md` in the memory bank folder
|
||||
2. Document the task with:
|
||||
- Task name and description
|
||||
- Files that need to be modified
|
||||
- Step-by-step workflow followed
|
||||
- Important considerations or gotchas
|
||||
- Example of the completed implementation
|
||||
3. Include any context that was discovered during task execution but wasn't previously documented
|
||||
|
||||
Example task entry:
|
||||
```markdown
|
||||
## Add New Model Support
|
||||
**Last performed:** [date]
|
||||
**Files to modify:**
|
||||
- `/providers/gemini.md` - Add model to documentation
|
||||
- `/src/providers/gemini-config.ts` - Add model configuration
|
||||
- `/src/constants/models.ts` - Add to model list
|
||||
- `/tests/providers/gemini.test.ts` - Add test cases
|
||||
|
||||
**Steps:**
|
||||
1. Add model configuration with proper token limits
|
||||
2. Update documentation with model capabilities
|
||||
3. Add to constants file for UI display
|
||||
4. Write tests for new model configuration
|
||||
|
||||
**Important notes:**
|
||||
- Check Google's documentation for exact token limits
|
||||
- Ensure backward compatibility with existing configurations
|
||||
- Test with actual API calls before committing
|
||||
```
|
||||
|
||||
### Regular Task Execution
|
||||
|
||||
In the beginning of EVERY task I MUST read ALL memory bank files - this is not optional.
|
||||
|
||||
The memory bank files are located in `.kilocode/rules/memory-bank` folder. If the folder doesn't exist or is empty, I will warn user about potential issues with the memory bank. I will include `[Memory Bank: Active]` at the beginning of my response if I successfully read the memory bank files, or `[Memory Bank: Missing]` if the folder doesn't exist or is empty. If memory bank is missing, I will warn the user about potential issues and suggest initialization. I should briefly summarize my understanding of the project to confirm alignment with the user's expectations, like:
|
||||
|
||||
"[Memory Bank: Active] I understand we're building a React inventory system with barcode scanning. Currently implementing the scanner component that needs to work with the backend API."
|
||||
|
||||
When starting a task that matches a documented task in `tasks.md`, I should mention this and follow the documented workflow to ensure no steps are missed.
|
||||
|
||||
If the task was repetitive and might be needed again, I should suggest: "Would you like me to add this task to the memory bank for future reference?"
|
||||
|
||||
In the end of the task, when it seems to be completed, I will update `context.md` accordingly. If the change seems significant, I will suggest to the user: "Would you like me to update memory bank to reflect these changes?" I will not suggest updates for minor changes.
|
||||
|
||||
## Context Window Management
|
||||
|
||||
When the context window fills up during an extended session:
|
||||
1. I should suggest updating the memory bank to preserve the current state
|
||||
2. Recommend starting a fresh conversation/task
|
||||
3. In the new conversation, I will automatically load the memory bank files to maintain continuity
|
||||
|
||||
## Technical Implementation
|
||||
|
||||
Memory Bank is built on Kilo Code's Custom Rules feature, with files stored as standard markdown documents that both the user and I can access.
|
||||
|
||||
## Important Notes
|
||||
|
||||
REMEMBER: After every memory reset, I begin completely fresh. The Memory Bank is my only link to previous work. It must be maintained with precision and clarity, as my effectiveness depends entirely on its accuracy.
|
||||
|
||||
If I detect inconsistencies between memory bank files, I should prioritize brief.md and note any discrepancies to the user.
|
||||
|
||||
IMPORTANT: I MUST read ALL memory bank files at the start of EVERY task - this is not optional. The memory bank files are located in `.kilocode/rules/memory-bank` folder.
|
||||
@@ -1,137 +0,0 @@
|
||||
# Architecture Overview
|
||||
|
||||
## System Architecture
|
||||
|
||||
The Kilo Code documentation site is built using Docusaurus 3.8.1, a modern static site generator optimized for documentation websites. The architecture follows a standard Docusaurus pattern with custom enhancements for the Kilo Code brand and functionality.
|
||||
|
||||
## Project Structure
|
||||
|
||||
### Root Configuration
|
||||
- [`package.json`](package.json:1) - Project dependencies and build scripts
|
||||
- [`docusaurus.config.ts`](docusaurus.config.ts:1) - Main Docusaurus configuration
|
||||
- [`sidebars.ts`](sidebars.ts:1) - Documentation navigation structure
|
||||
- [`.env.example`](.env.example:1) - Environment variables template
|
||||
|
||||
### Source Code Organization
|
||||
|
||||
#### `/src` Directory
|
||||
- [`src/constants.ts`](src/constants.ts:1) - Application-wide constants (URLs, links, configuration)
|
||||
- [`src/components/`](src/components/) - Custom React components
|
||||
- [`Codicon.tsx`](src/components/Codicon.tsx:1) - VS Code icon component
|
||||
- [`Image.js`](src/components/Image.js:1) - Enhanced image component
|
||||
- [`ReportIssue/`](src/components/ReportIssue/) - Issue reporting component
|
||||
- [`YouTubeEmbed/`](src/components/YouTubeEmbed/) - YouTube video embedding
|
||||
- [`src/css/custom.css`](src/css/custom.css:1) - Global styling and theme customization
|
||||
- [`src/theme/`](src/theme/) - Docusaurus theme customizations
|
||||
|
||||
#### `/docs` Directory Structure
|
||||
The documentation follows a hierarchical organization:
|
||||
|
||||
```
|
||||
docs/
|
||||
├── index.mdx # Landing page
|
||||
├── getting-started/ # Installation and setup
|
||||
├── basic-usage/ # Core functionality
|
||||
├── features/ # Feature documentation
|
||||
│ ├── tools/ # Tool reference
|
||||
│ ├── mcp/ # MCP integration
|
||||
│ ├── slash-commands/ # Command workflows
|
||||
│ └── experimental/ # Beta features
|
||||
├── advanced-usage/ # Advanced topics
|
||||
├── providers/ # AI provider setup guides
|
||||
└── extending/ # Development and contribution
|
||||
```
|
||||
|
||||
#### `/static` Directory
|
||||
- [`static/img/`](static/img/) - Images organized by feature/section
|
||||
- [`static/downloads/`](static/downloads/) - Downloadable resources
|
||||
|
||||
### Key Technical Decisions
|
||||
|
||||
#### Documentation Organization
|
||||
- **Feature-First Structure**: Documentation is organized by user journey and feature categories rather than technical implementation
|
||||
- **Provider Separation**: Each AI provider has dedicated documentation for setup and configuration
|
||||
- **Tool Reference**: Comprehensive tool documentation with individual pages for each tool
|
||||
|
||||
#### Navigation Design
|
||||
- **Progressive Disclosure**: Information is layered from basic to advanced usage
|
||||
- **Cross-References**: Extensive internal linking between related concepts
|
||||
- **Search Integration**: Local search with @easyops-cn/docusaurus-search-local
|
||||
|
||||
#### Content Strategy
|
||||
- **MDX Support**: Enhanced markdown with React component integration
|
||||
- **Code Examples**: Extensive use of code blocks with syntax highlighting
|
||||
- **Visual Documentation**: Screenshots and diagrams for complex concepts
|
||||
|
||||
## Component Relationships
|
||||
|
||||
### Core Components
|
||||
1. **Docusaurus Core** - Static site generation and routing
|
||||
2. **Custom Theme** - VS Code-inspired styling and branding
|
||||
3. **Search Integration** - Local search functionality
|
||||
4. **Analytics** - PostHog integration for usage tracking
|
||||
5. **Custom Components** - Enhanced documentation experience
|
||||
|
||||
### Data Flow
|
||||
1. **Content Creation** - Markdown/MDX files in `/docs`
|
||||
2. **Build Process** - Docusaurus compilation and optimization
|
||||
3. **Static Generation** - HTML/CSS/JS output for hosting
|
||||
4. **Deployment** - Static files served at https://kilocode.ai/docs
|
||||
|
||||
## Critical Implementation Paths
|
||||
|
||||
### Build System
|
||||
- **Development**: `npm start` - Local development server with hot reload
|
||||
- **Production**: `npm run build` - Optimized static site generation
|
||||
- **Deployment**: Static files hosted with CDN distribution
|
||||
|
||||
### Content Management
|
||||
- **Documentation Updates**: Direct markdown file editing
|
||||
- **Asset Management**: Static files in organized directory structure
|
||||
- **Version Control**: Git-based workflow for content updates
|
||||
|
||||
### Search Implementation
|
||||
- **Local Search**: @easyops-cn/docusaurus-search-local plugin
|
||||
- **Indexing**: Automatic content indexing during build
|
||||
- **Search UI**: Integrated search bar with contextual results
|
||||
|
||||
### Customization Points
|
||||
- **Theme Overrides**: Custom CSS and component swizzling
|
||||
- **Plugin Configuration**: Docusaurus plugin ecosystem integration
|
||||
- **Content Enhancement**: MDX components for interactive documentation
|
||||
|
||||
## Integration Points
|
||||
|
||||
### External Services
|
||||
- **PostHog Analytics**: User behavior tracking and insights
|
||||
- **GitHub Integration**: Edit links and issue reporting
|
||||
- **Community Platforms**: Discord, Reddit, Twitter integration
|
||||
|
||||
### VS Code Extension Integration
|
||||
- **Deep Linking**: Direct links to extension installation
|
||||
- **Context Sharing**: Documentation references from extension
|
||||
- **Feature Parity**: Documentation reflects current extension capabilities
|
||||
|
||||
## Performance Considerations
|
||||
|
||||
### Build Optimization
|
||||
- **Static Generation**: Pre-built HTML for fast loading
|
||||
- **Asset Optimization**: Image compression and lazy loading
|
||||
- **Code Splitting**: JavaScript bundle optimization
|
||||
|
||||
### User Experience
|
||||
- **Mobile Responsive**: Optimized for all device sizes
|
||||
- **Fast Navigation**: Client-side routing for smooth transitions
|
||||
- **Search Performance**: Local search for instant results
|
||||
|
||||
## Maintenance Patterns
|
||||
|
||||
### Content Updates
|
||||
- **Regular Reviews**: Documentation accuracy validation
|
||||
- **Feature Alignment**: Updates synchronized with extension releases
|
||||
- **Community Feedback**: User-driven improvements and corrections
|
||||
|
||||
### Technical Maintenance
|
||||
- **Dependency Updates**: Regular package updates and security patches
|
||||
- **Performance Monitoring**: Build time and site performance tracking
|
||||
- **Accessibility**: WCAG compliance and usability improvements
|
||||
@@ -1 +0,0 @@
|
||||
This is the technical and user documentation for Kilo Code, an open source AI agent VS Code extension. It helps you write code more efficiently by generating code, automating tasks, and providing suggestions. It is written with the documentation library Docusaurus and hosted at https://kilocode.ai/docs
|
||||
@@ -1,78 +0,0 @@
|
||||
# Current Context
|
||||
|
||||
## Project Status
|
||||
|
||||
The Kilo Code documentation site is a mature, production-ready Docusaurus project that serves as the comprehensive documentation hub for the Kilo Code VS Code extension. The site is hosted at https://kilocode.ai/docs and provides extensive documentation covering installation, usage, features, and extension capabilities.
|
||||
|
||||
## Current Work Focus
|
||||
|
||||
**Memory Bank Initialization**: Currently performing comprehensive memory bank initialization to establish persistent project context for future AI interactions. This involves analyzing the entire documentation structure, understanding the project's purpose, and creating structured documentation files.
|
||||
|
||||
## Recent Changes
|
||||
|
||||
- Memory bank system being implemented with structured documentation files
|
||||
- Product overview documented with comprehensive feature descriptions
|
||||
- Project structure analyzed including all documentation categories and provider integrations
|
||||
|
||||
## Documentation Structure
|
||||
|
||||
The documentation is organized into several major sections:
|
||||
|
||||
### Core User Journey
|
||||
- **Getting Started**: Installation, setup, and first task completion
|
||||
- **Using Kilo Code**: Chat interface, modes, context mentions, and basic features
|
||||
- **Core Concepts**: Auto-approving actions, suggested responses, tool usage, and checkpoints
|
||||
|
||||
### Advanced Features
|
||||
- **Advanced Usage**: Prompt engineering, customization options, memory bank, and large project handling
|
||||
- **Customization**: Settings management, custom modes, API configuration profiles
|
||||
- **Extending Kilo Code**: Model providers (18+ supported), local models, MCP integration, shell integration
|
||||
|
||||
### Reference Materials
|
||||
- **Tools Reference**: Comprehensive documentation of all 15+ available tools
|
||||
- **Provider Documentation**: Detailed setup guides for Anthropic, OpenAI, and 16+ other AI providers
|
||||
- **Community Resources**: Contributing guidelines, development environment setup
|
||||
|
||||
## Key Features Documented
|
||||
|
||||
### Core Capabilities
|
||||
- Multi-mode AI assistance (Code, Architect, Ask, Debug, Custom)
|
||||
- Comprehensive tool ecosystem for file operations, browser automation, and system commands
|
||||
- Memory Bank system for persistent project context
|
||||
- MCP (Model Context Protocol) integration for external tool connectivity
|
||||
|
||||
### User Experience Features
|
||||
- Auto-generated commit messages with customizable templates
|
||||
- Context mentions for precise file and code referencing
|
||||
- Checkpoints for conversation state management
|
||||
- Fast edits and surgical code modifications
|
||||
- Browser automation for web testing and interaction
|
||||
|
||||
### Extensibility
|
||||
- 18+ AI model providers supported
|
||||
- Custom mode creation with file restrictions and tool limitations
|
||||
- Local model support for privacy-conscious development
|
||||
- MCP server integration for unlimited external tool connectivity
|
||||
|
||||
## Technical Implementation
|
||||
|
||||
The site uses modern web technologies:
|
||||
- **Framework**: Docusaurus 3.8.1 for static site generation
|
||||
- **Styling**: Custom CSS with VS Code-inspired design elements
|
||||
- **Search**: Local search implementation with @easyops-cn/docusaurus-search-local
|
||||
- **Analytics**: PostHog integration for usage tracking
|
||||
- **Components**: Custom React components for enhanced documentation experience
|
||||
|
||||
## Next Steps
|
||||
|
||||
1. Complete memory bank initialization with remaining core files
|
||||
2. Document the technical architecture and build system
|
||||
3. Create task documentation for common documentation workflows
|
||||
4. Validate all memory bank files for accuracy and completeness
|
||||
|
||||
## Important Considerations
|
||||
|
||||
- Documentation must remain accessible to both technical and non-technical users
|
||||
- All provider documentation needs to stay current with API changes
|
||||
- Memory bank system documentation serves as both user guide and implementation reference
|
||||
- Community contributions are encouraged through GitHub discussions and pull requests
|
||||
@@ -1,95 +0,0 @@
|
||||
# Product Overview
|
||||
|
||||
## What Kilo Code Is
|
||||
|
||||
Kilo Code is an open source AI agent VS Code extension that transforms how developers write code by providing intelligent, context-aware assistance directly within the VS Code editor. It serves as a persistent development partner that can understand projects, generate code, automate tasks, and provide suggestions.
|
||||
|
||||
## Problems It Solves
|
||||
|
||||
### Core Development Pain Points
|
||||
- **Blank Page Syndrome**: Eliminates the struggle of starting new code or features from scratch
|
||||
- **Context Switching**: Reduces time spent switching between documentation, Stack Overflow, and code
|
||||
- **Repetitive Tasks**: Automates common development workflows like commit message generation, boilerplate creation, and file operations
|
||||
- **Code Quality**: Helps with refactoring, debugging, and maintaining consistent coding standards
|
||||
- **Project Understanding**: Assists in understanding large codebases and complex architectures
|
||||
|
||||
### AI Memory Limitations
|
||||
- **Session Reset Problem**: Traditional AI assistants lose all context between sessions, requiring re-explanation of project details
|
||||
- **Inefficient Context Gathering**: Without memory, AI must re-analyze entire codebases repeatedly, which is slow and expensive
|
||||
- **Inconsistent Understanding**: Lack of persistent context leads to inconsistent suggestions and solutions
|
||||
|
||||
## How Kilo Code Works
|
||||
|
||||
### Core Interaction Model
|
||||
Users interact with Kilo Code through a chat interface within VS Code, using natural language to describe what they want to accomplish. Kilo Code then uses specialized modes and tools to fulfill requests.
|
||||
|
||||
### Mode System
|
||||
- **Code Mode**: General-purpose coding tasks, file editing, project creation
|
||||
- **Architect Mode**: Planning, design, technical leadership, and documentation
|
||||
- **Ask Mode**: Information gathering, explanations, and learning
|
||||
- **Debug Mode**: Systematic problem diagnosis and troubleshooting
|
||||
- **Custom Modes**: Unlimited specialized personas for specific workflows
|
||||
|
||||
### Tool Ecosystem
|
||||
Kilo Code uses a sophisticated tool system organized into groups:
|
||||
- **Read Tools**: File exploration, code analysis, project understanding
|
||||
- **Edit Tools**: Code modification, file creation, precise surgical edits
|
||||
- **Browser Tools**: Web automation and testing
|
||||
- **Command Tools**: System command execution and build processes
|
||||
- **MCP Tools**: External service integration through Model Context Protocol
|
||||
- **Workflow Tools**: Task management, mode switching, progress tracking
|
||||
|
||||
### Memory Bank System
|
||||
A revolutionary approach to AI context preservation that maintains project understanding across sessions through structured documentation files that both the AI and developers can access.
|
||||
|
||||
## User Experience Goals
|
||||
|
||||
### Seamless Integration
|
||||
- Natural language interaction within familiar VS Code environment
|
||||
- No context switching between tools or applications
|
||||
- Immediate access through sidebar panel
|
||||
|
||||
### Intelligent Assistance
|
||||
- Context-aware suggestions based on current project and codebase
|
||||
- Proactive help with common development patterns
|
||||
- Learning from user preferences and project conventions
|
||||
|
||||
### Workflow Enhancement
|
||||
- Streamlined development processes through automation
|
||||
- Reduced cognitive load for repetitive tasks
|
||||
- Enhanced productivity without disrupting existing workflows
|
||||
|
||||
### Extensibility
|
||||
- Support for multiple AI model providers
|
||||
- Custom mode creation for specialized workflows
|
||||
- MCP integration for unlimited tool expansion
|
||||
- Local model support for privacy-conscious development
|
||||
|
||||
## Target Outcomes
|
||||
|
||||
### For Individual Developers
|
||||
- Faster code generation and iteration cycles
|
||||
- Improved code quality through AI-assisted refactoring and debugging
|
||||
- Reduced time spent on documentation and boilerplate code
|
||||
- Enhanced learning through AI explanations and suggestions
|
||||
|
||||
### For Development Teams
|
||||
- Consistent coding standards and practices
|
||||
- Shared custom modes for standardized workflows
|
||||
- Improved code review processes through better commit messages
|
||||
- Knowledge preservation through Memory Bank documentation
|
||||
|
||||
### For Projects
|
||||
- Better documentation as a byproduct of AI assistance
|
||||
- More maintainable codebases through consistent patterns
|
||||
- Faster onboarding for new team members
|
||||
- Preserved project knowledge across team changes
|
||||
|
||||
## Success Metrics
|
||||
|
||||
The product succeeds when developers report:
|
||||
- Increased coding velocity and reduced time-to-completion
|
||||
- Improved code quality and fewer bugs
|
||||
- Enhanced understanding of complex codebases
|
||||
- Reduced friction in development workflows
|
||||
- Better project documentation and knowledge retention
|
||||
@@ -1,391 +0,0 @@
|
||||
# Documentation Tasks
|
||||
|
||||
This file documents common repetitive tasks and workflows for maintaining the Kilo Code documentation site.
|
||||
|
||||
## Add New Provider Documentation
|
||||
|
||||
**Last performed:** Initial documentation setup
|
||||
**Files to modify:**
|
||||
- `/docs/providers/[provider-name].md` - Create new provider documentation
|
||||
- `/sidebars.ts` - Add provider to navigation structure
|
||||
- `/src/constants.ts` - Add provider URLs if needed
|
||||
|
||||
**Steps:**
|
||||
1. Create new provider documentation file in `/docs/providers/`
|
||||
2. Follow the standard provider documentation template:
|
||||
- Introduction and website link
|
||||
- Getting an API Key section
|
||||
- Supported Models section
|
||||
- Configuration in Kilo Code section
|
||||
- Tips and Notes section
|
||||
3. Add provider to the Model Providers section in `sidebars.ts`
|
||||
4. Update constants file if new URLs are needed
|
||||
5. Test documentation locally with `npm start`
|
||||
6. Verify all links work correctly
|
||||
|
||||
**Template structure:**
|
||||
```markdown
|
||||
---
|
||||
sidebar_label: Provider Name
|
||||
---
|
||||
|
||||
# Using [Provider Name] With Kilo Code
|
||||
|
||||
Brief description of the provider and their strengths.
|
||||
|
||||
**Website:** [Provider URL]
|
||||
|
||||
## Getting an API Key
|
||||
[Step-by-step instructions]
|
||||
|
||||
## Supported Models
|
||||
[List of supported models]
|
||||
|
||||
## Configuration in Kilo Code
|
||||
[Setup instructions]
|
||||
|
||||
## Tips and Notes
|
||||
[Additional helpful information]
|
||||
```
|
||||
|
||||
## Add New Tool Documentation
|
||||
|
||||
**Last performed:** Tool reference documentation setup
|
||||
**Files to modify:**
|
||||
- `/docs/features/tools/[tool-name].md` - Create new tool documentation
|
||||
- `/sidebars.ts` - Add tool to Tools Reference section
|
||||
- `/docs/features/tools/tool-use-overview.md` - Update tool overview if needed
|
||||
|
||||
**Steps:**
|
||||
1. Create new tool documentation file in `/docs/features/tools/`
|
||||
2. Follow the standard tool documentation template
|
||||
3. Add tool to the Tools Reference section in `sidebars.ts`
|
||||
4. Update tool overview page if the tool represents a new category
|
||||
5. Test documentation locally
|
||||
6. Verify code examples and parameter descriptions are accurate
|
||||
|
||||
**Important notes:**
|
||||
- Include practical examples of tool usage
|
||||
- Document all parameters with their types and requirements
|
||||
- Explain when and why to use the tool
|
||||
- Include common error scenarios and solutions
|
||||
|
||||
## Update Feature Documentation
|
||||
|
||||
**Last performed:** Feature documentation organization
|
||||
**Files to modify:**
|
||||
- Relevant feature documentation files in `/docs/features/`
|
||||
- `/sidebars.ts` - Update navigation if structure changes
|
||||
- `/docs/index.mdx` - Update feature highlights if major features added
|
||||
|
||||
**Steps:**
|
||||
1. Identify which feature documentation needs updates
|
||||
2. Review current documentation for accuracy
|
||||
3. Update content to reflect latest extension capabilities
|
||||
4. Add new screenshots if UI has changed
|
||||
5. Update navigation structure if needed
|
||||
6. Test all internal links
|
||||
7. Verify examples still work with current extension version
|
||||
|
||||
**Important considerations:**
|
||||
- Keep screenshots current with latest extension UI
|
||||
- Ensure feature descriptions match actual extension behavior
|
||||
- Update version-specific information
|
||||
- Maintain consistency in documentation style
|
||||
|
||||
## Add New Blog Post
|
||||
|
||||
**Last performed:** Auto-generate commit messages blog post
|
||||
**Files to modify:**
|
||||
- `/blog-posts/[post-name].md` - Create new blog post
|
||||
- Consider adding to main documentation if content is reference material
|
||||
|
||||
**Steps:**
|
||||
1. Create new blog post file in `/blog-posts/`
|
||||
2. Follow the established blog post style and tone
|
||||
3. Include practical examples and real-world usage
|
||||
4. Add relevant images to `/static/img/` if needed
|
||||
5. Consider if content should also be added to main documentation
|
||||
6. Review for clarity and technical accuracy
|
||||
|
||||
**Content guidelines:**
|
||||
- Focus on practical benefits and real-world usage
|
||||
- Include specific examples and code snippets
|
||||
- Maintain conversational but informative tone
|
||||
- Link to relevant documentation sections
|
||||
|
||||
## Update Provider API Changes
|
||||
|
||||
**Last performed:** Provider documentation updates
|
||||
**Files to modify:**
|
||||
- Relevant provider documentation in `/docs/providers/`
|
||||
- `/docs/getting-started/connecting-api-provider.md` - If setup process changes
|
||||
|
||||
**Steps:**
|
||||
1. Identify which providers have API changes
|
||||
2. Update supported models lists
|
||||
3. Update configuration instructions if needed
|
||||
4. Update pricing information references
|
||||
5. Test configuration steps with actual provider APIs
|
||||
6. Update screenshots if provider UIs have changed
|
||||
|
||||
**Important notes:**
|
||||
- Verify model names and capabilities with provider documentation
|
||||
- Check for new authentication methods or requirements
|
||||
- Update rate limit information if changed
|
||||
- Ensure all external links are still valid
|
||||
|
||||
## Reorganize Documentation Structure
|
||||
|
||||
**Last performed:** Features section reorganization
|
||||
**Files to modify:**
|
||||
- `/sidebars.ts` - Primary navigation structure changes
|
||||
- `/docusaurus.config.ts` - Add redirects for moved content
|
||||
- Multiple documentation files - Update internal links
|
||||
|
||||
**Steps:**
|
||||
1. Plan new documentation structure
|
||||
2. Update `sidebars.ts` with new organization
|
||||
3. Add redirects in `docusaurus.config.ts` for moved content
|
||||
4. Update internal links throughout documentation
|
||||
5. Test all navigation paths
|
||||
6. Verify search functionality still works
|
||||
7. Update any hardcoded paths in components
|
||||
|
||||
**Important considerations:**
|
||||
- Always add redirects for moved content to prevent broken links
|
||||
- Update internal link references throughout the site
|
||||
- Test navigation flow from user perspective
|
||||
- Consider impact on external links and bookmarks
|
||||
|
||||
## Add New Custom Component
|
||||
|
||||
**Last performed:** YouTube embed and image components
|
||||
**Files to modify:**
|
||||
- `/src/components/[ComponentName]/` - Create new component directory
|
||||
- `/src/theme/MDXComponents.ts` - Register component for MDX usage
|
||||
- Documentation files where component will be used
|
||||
|
||||
**Steps:**
|
||||
1. Create component directory in `/src/components/`
|
||||
2. Implement React component with TypeScript
|
||||
3. Add component styles in separate CSS module if needed
|
||||
4. Register component in `MDXComponents.ts` for MDX usage
|
||||
5. Test component in development environment
|
||||
6. Document component usage for other contributors
|
||||
7. Use component in relevant documentation files
|
||||
|
||||
**Component guidelines:**
|
||||
- Follow existing component patterns and styling
|
||||
- Use TypeScript for type safety
|
||||
- Include proper error handling
|
||||
- Make components reusable and configurable
|
||||
- Follow accessibility best practices
|
||||
|
||||
## Update Screenshots and Visual Assets
|
||||
|
||||
**Last performed:** Ongoing maintenance need
|
||||
**Files to modify:**
|
||||
- `/static/img/[feature-directories]/` - Update screenshot files
|
||||
- Documentation files with embedded images - Update image references
|
||||
- `/docs/getting-started/` - Installation and setup screenshots
|
||||
- `/docs/basic-usage/` - Interface and workflow screenshots
|
||||
|
||||
**Steps:**
|
||||
1. Identify which features have UI changes from extension releases
|
||||
2. Take new screenshots in consistent browser/OS environment
|
||||
3. Optimize images for web (compress, appropriate dimensions)
|
||||
4. Replace old screenshots in `/static/img/` directories
|
||||
5. Update any image references in documentation files
|
||||
6. Test that all images load correctly in development
|
||||
7. Verify images are accessible and have proper alt text
|
||||
|
||||
**Important considerations:**
|
||||
- Maintain consistent screenshot style (browser, zoom level, theme)
|
||||
- Use descriptive filenames that match the feature being documented
|
||||
- Compress images to keep site performance optimal
|
||||
- Update alt text for accessibility
|
||||
- Consider creating a screenshot style guide for consistency
|
||||
|
||||
## Graduate Experimental Features to Stable
|
||||
|
||||
**Last performed:** Codebase indexing graduation
|
||||
**Files to modify:**
|
||||
- Feature documentation files - Remove experimental warnings
|
||||
- `/sidebars.ts` - Move from experimental to appropriate section
|
||||
- `/docs/features/experimental/` - Remove from experimental list
|
||||
- Related tool documentation - Update experimental status
|
||||
- `/docusaurus.config.ts` - Add redirects if URLs change
|
||||
|
||||
**Steps:**
|
||||
1. Identify features graduating from experimental status
|
||||
2. Remove experimental warnings and disclaimers from documentation
|
||||
3. Update navigation structure in `sidebars.ts`
|
||||
4. Move documentation files if directory structure changes
|
||||
5. Add redirects for any changed URLs
|
||||
6. Update cross-references throughout documentation
|
||||
7. Remove duplicate documentation if it exists
|
||||
8. Update feature overview pages to reflect stable status
|
||||
|
||||
**Important considerations:**
|
||||
- Always add redirects for moved content to prevent broken links
|
||||
- Search for all references to the feature across documentation
|
||||
- Update any "experimental features" overview pages
|
||||
- Consider if feature deserves more prominent placement in navigation
|
||||
- Verify all examples and instructions work with stable version
|
||||
|
||||
## Process Extension Release Documentation Updates
|
||||
|
||||
**Last performed:** Version-specific updates from todos.md
|
||||
**Files to modify:**
|
||||
- Multiple feature documentation files based on release notes
|
||||
- Provider documentation for new models or API changes
|
||||
- Tool documentation for behavior changes
|
||||
- Getting started guides for new onboarding features
|
||||
- FAQ or troubleshooting sections for resolved issues
|
||||
|
||||
**Steps:**
|
||||
1. Review extension release notes for documentation impacts
|
||||
2. Categorize changes: UI updates, new features, bug fixes, model additions
|
||||
3. Update relevant feature documentation with new capabilities
|
||||
4. Add or update screenshots for UI changes
|
||||
5. Update provider documentation for new models
|
||||
6. Update tool documentation for behavior changes
|
||||
7. Add troubleshooting entries for resolved issues
|
||||
8. Test all updated examples and instructions
|
||||
|
||||
**Important considerations:**
|
||||
- Prioritize user-facing changes that affect documentation accuracy
|
||||
- Update version-specific information where relevant
|
||||
- Ensure examples still work with current extension version
|
||||
- Consider if changes require updates to getting started flow
|
||||
- Document any breaking changes or migration steps
|
||||
|
||||
## Manage Documentation Redirects
|
||||
|
||||
**Last performed:** MCP and features section reorganization
|
||||
**Files to modify:**
|
||||
- `/docusaurus.config.ts` - Add redirect configurations
|
||||
- `/sidebars.ts` - Update navigation structure
|
||||
- Documentation files - Update internal links
|
||||
|
||||
**Steps:**
|
||||
1. Plan new documentation structure or identify moved content
|
||||
2. Document all URL changes that will occur
|
||||
3. Add redirect entries in `docusaurus.config.ts`
|
||||
4. Update navigation structure in `sidebars.ts`
|
||||
5. Update internal links throughout documentation
|
||||
6. Test all redirect paths work correctly
|
||||
7. Verify search functionality still works
|
||||
8. Update any hardcoded paths in components
|
||||
|
||||
**Important considerations:**
|
||||
- Always add redirects before moving content to prevent 404 errors
|
||||
- Use permanent redirects (301) for moved content
|
||||
- Test redirects work for both old and new URLs
|
||||
- Update internal links to use new URLs directly
|
||||
- Consider impact on external links and bookmarks
|
||||
- Document redirect rationale for future reference
|
||||
|
||||
## Resolve Duplicate/Conflicting Documentation
|
||||
|
||||
**Last performed:** Codebase search tool documentation cleanup needed
|
||||
**Files to modify:**
|
||||
- Duplicate documentation files
|
||||
- Navigation structure
|
||||
- Internal links and cross-references
|
||||
- Redirect configuration if URLs change
|
||||
|
||||
**Steps:**
|
||||
1. Identify duplicate or conflicting documentation files
|
||||
2. Compare content to determine which version is authoritative
|
||||
3. Merge useful content from both versions if needed
|
||||
4. Remove or redirect the duplicate file
|
||||
5. Update navigation to remove duplicate entries
|
||||
6. Update internal links to point to single authoritative source
|
||||
7. Add redirects if removing a file that might be bookmarked
|
||||
8. Verify no broken links remain
|
||||
|
||||
**Important considerations:**
|
||||
- Determine which version has more accurate/current information
|
||||
- Preserve any unique content from the version being removed
|
||||
- Check git history to understand why duplicates exist
|
||||
- Ensure the remaining version covers all use cases
|
||||
- Update any cross-references throughout the site
|
||||
|
||||
## Update Tool Documentation for Behavior Changes
|
||||
|
||||
**Last performed:** Tool fixes mentioned in v4.58.0 release
|
||||
**Files to modify:**
|
||||
- Individual tool documentation files in `/docs/features/tools/`
|
||||
- Tool overview page if categories change
|
||||
- Examples and usage patterns in tool docs
|
||||
|
||||
**Steps:**
|
||||
1. Review extension release notes for tool behavior changes
|
||||
2. Identify which tools have updated functionality
|
||||
3. Update parameter descriptions and requirements
|
||||
4. Update examples to reflect new behavior
|
||||
5. Add or update limitation sections
|
||||
6. Update "when is it used" sections if use cases change
|
||||
7. Test examples to ensure they work correctly
|
||||
8. Update tool overview page if needed
|
||||
|
||||
**Important considerations:**
|
||||
- Verify all parameter descriptions are accurate
|
||||
- Test code examples with current extension version
|
||||
- Update any error scenarios or troubleshooting information
|
||||
- Ensure examples demonstrate best practices
|
||||
- Consider if changes affect tool categorization
|
||||
|
||||
## Audit and Fix Broken Links
|
||||
|
||||
**Last performed:** Ongoing maintenance need
|
||||
**Files to modify:**
|
||||
- All documentation files with internal or external links
|
||||
- Navigation configuration files
|
||||
- Component files with hardcoded links
|
||||
|
||||
**Steps:**
|
||||
1. Run Docusaurus build to identify broken internal links
|
||||
2. Use link checking tools for external links
|
||||
3. Manually verify provider URLs and external service links
|
||||
4. Update or remove broken external links
|
||||
5. Fix internal link references
|
||||
6. Update navigation structure if needed
|
||||
7. Test all fixed links work correctly
|
||||
8. Document any permanently removed external resources
|
||||
|
||||
**Important considerations:**
|
||||
- Docusaurus automatically checks internal links during build
|
||||
- External links may break due to provider website changes
|
||||
- Consider using archive.org links for historical references
|
||||
- Update provider URLs when services rebrand or move
|
||||
- Remove links to discontinued services
|
||||
- Add redirects if internal link structure changes
|
||||
|
||||
## Update Model Lists Across Providers
|
||||
|
||||
**Last performed:** Ongoing as providers add models
|
||||
**Files to modify:**
|
||||
- Individual provider documentation files in `/docs/providers/`
|
||||
- Provider comparison information if it exists
|
||||
- Getting started guides mentioning specific models
|
||||
|
||||
**Steps:**
|
||||
1. Review provider websites and APIs for new model additions
|
||||
2. Update supported models lists in provider documentation
|
||||
3. Add model capabilities and limitations information
|
||||
4. Update pricing references if available
|
||||
5. Test configuration with new models if possible
|
||||
6. Update any model comparison information
|
||||
7. Verify model names and identifiers are correct
|
||||
8. Update examples to use current model names
|
||||
|
||||
**Important considerations:**
|
||||
- Verify model names exactly match provider APIs
|
||||
- Include context window sizes and capabilities where relevant
|
||||
- Note any special configuration requirements for new models
|
||||
- Update rate limit information if it varies by model
|
||||
- Consider if new models change provider recommendations
|
||||
- Test actual API connectivity when possible
|
||||
@@ -1,184 +0,0 @@
|
||||
# Technology Stack
|
||||
|
||||
## Core Framework
|
||||
|
||||
### Docusaurus 3.8.1
|
||||
|
||||
- **Purpose**: Modern static site generator optimized for documentation
|
||||
- **Key Features**: React-based, MDX support, built-in search, theming
|
||||
- **Configuration**: [`docusaurus.config.ts`](docusaurus.config.ts:1)
|
||||
|
||||
## Runtime Environment
|
||||
|
||||
### Node.js
|
||||
|
||||
- **Required Version**: Node.js 18.0 or higher
|
||||
- **Package Manager**: npm (with package-lock.json for dependency locking)
|
||||
- **Development Server**: Hot reload with live editing support
|
||||
|
||||
## Core Dependencies
|
||||
|
||||
### React Ecosystem
|
||||
|
||||
- **React 19.0.0**: Core UI library
|
||||
- **React DOM 19.0.0**: DOM rendering
|
||||
- **@mdx-js/react 3.0.0**: MDX component integration
|
||||
- **clsx 2.0.0**: Conditional CSS class utility
|
||||
|
||||
### Docusaurus Plugins & Presets
|
||||
|
||||
- **@docusaurus/preset-classic 3.8.1**: Standard Docusaurus configuration
|
||||
- **@docusaurus/plugin-client-redirects 3.8.1**: URL redirect management
|
||||
- **@easyops-cn/docusaurus-search-local 0.48.5**: Local search functionality
|
||||
|
||||
### Styling & UI Components
|
||||
|
||||
- **@vscode/codicons 0.0.36**: VS Code icon integration
|
||||
- **prism-react-renderer 2.3.0**: Syntax highlighting for code blocks
|
||||
- **Custom CSS**: VS Code-inspired theme in [`src/css/custom.css`](src/css/custom.css:1)
|
||||
|
||||
### Analytics & Tracking
|
||||
|
||||
- **posthog-docusaurus 2.0.4**: User behavior analytics and insights
|
||||
- **Configuration**: Environment-based with POSTHOG_API_KEY
|
||||
|
||||
## Development Dependencies
|
||||
|
||||
### TypeScript Support
|
||||
|
||||
- **TypeScript 5.6.2**: Type checking and development tooling
|
||||
- **@docusaurus/types 3.8.1**: Docusaurus TypeScript definitions
|
||||
- **@docusaurus/module-type-aliases 3.8.1**: Module type aliases
|
||||
- **@docusaurus/tsconfig 3.8.1**: Shared TypeScript configuration
|
||||
|
||||
### Development Tools
|
||||
|
||||
- **dotenv 16.4.7**: Environment variable management
|
||||
- **husky 9.1.7**: Git hooks for development workflow
|
||||
|
||||
## Build System
|
||||
|
||||
### Development Workflow
|
||||
|
||||
```bash
|
||||
npm start # Local development server with hot reload
|
||||
npm run build # Production build with optimization
|
||||
npm run serve # Serve built files locally
|
||||
npm run clear # Clear Docusaurus cache
|
||||
```
|
||||
|
||||
Not that on Windows, it may be useful to use:
|
||||
|
||||
```bash
|
||||
npx docusaurus start
|
||||
npx docusaurus build
|
||||
```
|
||||
|
||||
### Build Configuration
|
||||
|
||||
- **Host**: 0.0.0.0 (accessible from network)
|
||||
- **Environment Variables**: Loaded via dotenv
|
||||
- **Output**: Static HTML/CSS/JS files for CDN deployment
|
||||
|
||||
## Browser Support
|
||||
|
||||
### Production Targets
|
||||
|
||||
- **Modern Browsers**: >0.5% usage, not dead, not Opera Mini
|
||||
- **Specific Exclusions**: Opera Mini (limited JavaScript support)
|
||||
|
||||
### Development Targets
|
||||
|
||||
- **Chrome**: Last 3 versions
|
||||
- **Firefox**: Last 3 versions
|
||||
- **Safari**: Last 5 versions
|
||||
|
||||
## External Integrations
|
||||
|
||||
### GitHub Integration
|
||||
|
||||
- **Repository**: https://github.com/Kilo-Org/docs
|
||||
- **Edit Links**: Direct links to GitHub for documentation editing
|
||||
- **Issue Reporting**: Integrated issue creation workflow
|
||||
|
||||
### Community Platforms
|
||||
|
||||
- **Discord**: https://kilocode.ai/discord
|
||||
- **Reddit**: https://www.reddit.com/r/kilocode/
|
||||
- **Twitter**: https://x.com/kilocode
|
||||
- **YouTube**: https://www.youtube.com/@Kilo-Code
|
||||
|
||||
### VS Code Marketplace
|
||||
|
||||
- **Extension URL**: https://marketplace.visualstudio.com/items?itemName=kilocode.kilo-code
|
||||
- **Open VSX**: https://open-vsx.org/extension/kilocode/kilo-code
|
||||
|
||||
## Deployment Architecture
|
||||
|
||||
### Static Site Hosting
|
||||
|
||||
- **Production URL**: https://kilocode.ai/docs
|
||||
- **Base Path**: /docs (configured in docusaurus.config.ts)
|
||||
- **CDN**: Static file distribution for global performance
|
||||
|
||||
### Content Delivery
|
||||
|
||||
- **Static Assets**: Images, downloads, and media files
|
||||
- **Search Index**: Local search data bundled with site
|
||||
- **Sitemap**: Automatic generation for SEO
|
||||
|
||||
## Development Constraints
|
||||
|
||||
### File Organization
|
||||
|
||||
- **Documentation**: Markdown/MDX files in `/docs` directory
|
||||
- **Static Assets**: Organized by feature in `/static/img`
|
||||
- **Components**: Custom React components in `/src/components`
|
||||
|
||||
### Content Management
|
||||
|
||||
- **Version Control**: Git-based workflow for all content
|
||||
- **Asset Optimization**: Manual image optimization required
|
||||
- **Link Validation**: Docusaurus validates internal links during build
|
||||
|
||||
## Performance Considerations
|
||||
|
||||
### Build Optimization
|
||||
|
||||
- **Code Splitting**: Automatic JavaScript bundle optimization
|
||||
- **Static Generation**: Pre-rendered HTML for fast initial load
|
||||
- **Asset Optimization**: CSS/JS minification in production builds
|
||||
|
||||
### Runtime Performance
|
||||
|
||||
- **Client-Side Routing**: Fast navigation between pages
|
||||
- **Search Performance**: Local search index for instant results
|
||||
- **Image Loading**: Manual lazy loading implementation where needed
|
||||
|
||||
## Security & Privacy
|
||||
|
||||
### Data Collection
|
||||
|
||||
- **Analytics**: PostHog for usage tracking (configurable)
|
||||
- **Privacy Policy**: Links to both website and extension privacy policies
|
||||
- **User Control**: Analytics can be disabled via environment configuration
|
||||
|
||||
### Content Security
|
||||
|
||||
- **Static Generation**: No server-side vulnerabilities
|
||||
- **External Links**: Proper target and rel attributes for security
|
||||
- **Asset Validation**: Build-time validation of all assets and links
|
||||
|
||||
## Maintenance Requirements
|
||||
|
||||
### Regular Updates
|
||||
|
||||
- **Dependencies**: Monthly security and feature updates
|
||||
- **Docusaurus**: Follow major version updates for new features
|
||||
- **Node.js**: Maintain compatibility with LTS versions
|
||||
|
||||
### Content Synchronization
|
||||
|
||||
- **Extension Features**: Documentation must reflect current extension capabilities
|
||||
- **Provider APIs**: Keep provider setup guides current with API changes
|
||||
- **Community Links**: Verify external links remain active
|
||||
@@ -1,116 +0,0 @@
|
||||
## Settings and UI Documentation
|
||||
|
||||
### 10. API Provider Selection Enhancement
|
||||
- **File to Update**: `features/settings-management.md`
|
||||
- **Release Note**: v4.58.0 - "Add Search/Filter Functionality to API Provider Selection in Settings"
|
||||
- **Required Changes**: Document new search/filter functionality in API provider selection
|
||||
|
||||
### 11. Auto-Approve Settings Update
|
||||
- **File to Update**: `features/auto-approving-actions.md`
|
||||
- **Release Note**: v4.57.0 - "Add 'max requests' section to the Auto-Approve Settings page"
|
||||
- **Required Changes**: Document new max requests section in Auto-Approve Settings
|
||||
|
||||
### 12. Chat Interface Updates
|
||||
- **File to Update**: `basic-usage/the-chat-interface.md`
|
||||
- **Release Notes & Changes**:
|
||||
- v4.58.0 - "Add copy prompt button to task actions" → Document copy prompt button functionality
|
||||
- v4.56.0 - "Add idea suggestion box to get you inspired with some ideas when starting out fresh" → Document idea suggestion feature
|
||||
- v4.57.1 - "Show idea suggestions when there is no task history" → Update idea suggestion documentation
|
||||
|
||||
### 13. Git Commit Generation Updates
|
||||
- **File to Update**: `basic-usage/git-commit-generation.md`
|
||||
- **Release Note**: v4.56.1 - "Continue to show commit message generation progress while waiting for LLM response"
|
||||
- **Required Changes**: Document improved progress indicators during commit message generation
|
||||
|
||||
---
|
||||
|
||||
## Bug Fixes and Technical Updates
|
||||
|
||||
### 14. OpenRouter Provider Fix
|
||||
- **File to Update**: `providers/openrouter.md`
|
||||
- **Release Note**: v4.56.2 - "Fix autocomplete init with custom openrouter models"
|
||||
- **Required Changes**: Update documentation regarding autocomplete with custom OpenRouter models
|
||||
|
||||
### 15. Claude Code Windows Integration
|
||||
- **File to Update**: `providers/claude-code.md`
|
||||
- **Release Note**: v4.57.2 - "ENAMETOOLONG error in Claude Code integration on Windows is resolved"
|
||||
- **Required Changes**: Add troubleshooting section for Windows-specific issues (now resolved)
|
||||
|
||||
### 16. Error Handling Improvements
|
||||
- **File to Update**: `faq.md` or create troubleshooting section
|
||||
- **Release Note**: v4.57.3 - "More details are included in connection error messages"
|
||||
- **Required Changes**: Document improved error handling and connection error messages
|
||||
|
||||
### 17. Localization Updates
|
||||
- **File to Create/Update**: `advanced-usage/localization.md` (if doesn't exist)
|
||||
- **Release Notes**:
|
||||
- v4.58.1 - "French localization has been improved"
|
||||
- v4.58.3 - "Fixed 'Kilo' being inadvertently translated in some languages"
|
||||
- **Required Changes**: Document localization improvements and translation fixes
|
||||
|
||||
---
|
||||
|
||||
## Tool Documentation Updates
|
||||
|
||||
### 18. Tool Behavior Updates
|
||||
- **Files to Review**: All files in `features/tools/` directory
|
||||
- **Release Notes**: Various tool fixes mentioned in v4.58.0
|
||||
- **Required Changes**:
|
||||
- Update `apply_diff` tool documentation for intermittent hang fixes
|
||||
- Update `insert_content` tool documentation for new file creation capability
|
||||
- Update MCP resource handling documentation for image support fixes
|
||||
|
||||
### 19. Codebase Search Tool
|
||||
- **File to Update**: `features/tools/codebase-search.md` or `advanced-usage/available-tools/codebase-search.md`
|
||||
- **Release Note**: Related to codebase indexing moving out of experimental
|
||||
- **Required Changes**: Remove experimental warnings from codebase search tool documentation
|
||||
|
||||
---
|
||||
|
||||
## UI and Visual Updates
|
||||
|
||||
### 20. Settings Management UX
|
||||
- **File to Update**: `features/settings-management.md`
|
||||
- **Release Note**: v4.58.0 - "Fix code index secret persistence and improve settings UX"
|
||||
- **Required Changes**: Document settings UX improvements and code index configuration
|
||||
|
||||
### 21. Chat UI Improvements
|
||||
- **File to Update**: `basic-usage/the-chat-interface.md`
|
||||
- **Release Notes**: v4.58.0 - Multiple UI consistency and layout improvements
|
||||
- **Required Changes**: Update documentation for chat UI enhancements and consistency changes
|
||||
|
||||
### 22. Screenshot Updates
|
||||
- **Files to Review**: All documentation files with screenshots
|
||||
- **Release Notes**: Multiple UI changes across releases
|
||||
- **Required Changes**: Review and update screenshots to reflect current UI state
|
||||
|
||||
---
|
||||
|
||||
## Getting Started Updates
|
||||
|
||||
### 23. First Task Experience
|
||||
- **File to Update**: `getting-started/your-first-task.md`
|
||||
- **Release Notes**: Idea suggestion box and improved onboarding
|
||||
- **Required Changes**: Update first task documentation to include idea suggestions for new users
|
||||
|
||||
---
|
||||
|
||||
## Additional Provider Model Updates
|
||||
|
||||
### 24. Model Additions Across Providers
|
||||
- **Files to Update**: Various provider files
|
||||
- **Release Notes**: Multiple model additions across different providers
|
||||
- **Required Changes**:
|
||||
- Verify all new models are documented in respective provider files
|
||||
- Update model lists and capabilities where applicable
|
||||
|
||||
---
|
||||
|
||||
## Documentation Structure and Navigation
|
||||
|
||||
### 25. File Organization Review
|
||||
- **Files to Review**: All documentation files
|
||||
- **Changes**:
|
||||
- Ensure codebase indexing is properly moved out of experimental
|
||||
- Verify all internal links work after any file moves
|
||||
- Update navigation and cross-references as needed
|
||||
@@ -1,217 +0,0 @@
|
||||
customModes:
|
||||
- slug: video-script-writer
|
||||
name: Video Script Writer
|
||||
roleDefinition: >-
|
||||
**Persona: Kilo Code Expert Scriptwriter**
|
||||
|
||||
|
||||
**Background:**
|
||||
|
||||
A professional scriptwriter specializing in creating clear, engaging, and
|
||||
informative scripts tailored specifically for YouTube, Reddit tutorials,
|
||||
and documentation videos focused on Kilo Code. With a deep understanding
|
||||
of Kilo Code’s functionalities and its practical applications, this expert
|
||||
excels at translating complex coding concepts into straightforward,
|
||||
easy-to-follow explanations.
|
||||
|
||||
|
||||
**Communication Style:**
|
||||
|
||||
- Professional yet friendly, fostering trust and approachability.
|
||||
|
||||
- Concise and structured, using precise language to ensure clarity.
|
||||
|
||||
- Logical flow, breaking down complex topics into manageable steps.
|
||||
|
||||
- Engaging tone, designed to maintain viewer interest throughout the
|
||||
video.
|
||||
|
||||
|
||||
**Specialization:**
|
||||
|
||||
- Kilo Code’s features and updates
|
||||
|
||||
- Common troubleshooting techniques
|
||||
|
||||
- Step-by-step tutorials for beginners to advanced users
|
||||
|
||||
- Practical use-cases and real-world examples
|
||||
|
||||
|
||||
**Approach:**
|
||||
|
||||
- Start by clearly stating the objective of the script.
|
||||
|
||||
- Provide concise explanations with relatable analogies when helpful.
|
||||
|
||||
- Anticipate common questions and proactively address them.
|
||||
|
||||
- Conclude with actionable insights or suggested next steps for users.
|
||||
|
||||
|
||||
**Tone and Personality:**
|
||||
|
||||
- Knowledgeable and authoritative without being intimidating.
|
||||
|
||||
- Patient and encouraging, ensuring viewers feel capable and supported.
|
||||
|
||||
- Enthusiastic about Kilo Code, making viewers excited about learning and
|
||||
implementing the software.
|
||||
|
||||
|
||||
**Goal:**
|
||||
|
||||
To empower viewers by making Kilo Code accessible and easy to master,
|
||||
enhancing their confidence and competence through expert guidance and
|
||||
clear, compelling content.
|
||||
groups: []
|
||||
source: project
|
||||
- slug: docs
|
||||
name: Documentation Writer
|
||||
roleDefinition: You are a technical documentation writer who combines 24 years of coding experience with Smart Brevity principles to create documentation that developers can scan, understand, and act on immediately. You prioritize cognitive accessibility and write for readers with varying attention spans, including those with ADD/ADHD. Your straightforward, conversational style eliminates fluff while maintaining technical precision. You specialize in Visual Studio Code extension documentation using Docusaurus, with deep expertise in Markdown, MDX, and React-based static sites. Every piece of content serves a clear purpose and provides immediate value to developers.
|
||||
customInstructions: >-
|
||||
### Documentation Standards
|
||||
|
||||
#### 1. **Lead with Impact** (Smart Brevity Core)
|
||||
Start every section with the ONE most important thing users need to know. Answer "why should I care?" before explaining "how to do it." Front-load value in the first sentence.
|
||||
|
||||
#### 2. **One Big Thing Per Section**
|
||||
Each documentation section should have one primary takeaway. State it clearly in the opening. Everything else supports that main point.
|
||||
|
||||
#### 3. **Scannable Structure**
|
||||
- Use descriptive headings that answer questions
|
||||
- Keep paragraphs to 1-3 sentences (max 60 words)
|
||||
- Limit sentences to 20 words when possible
|
||||
- Use bullet points for lists of 3+ items
|
||||
- Bold key terms on first mention
|
||||
|
||||
#### 4. **Precision Over Perfection**
|
||||
Write for experienced developers. Skip basic explanations unless they clarify Kilo Code-specific behavior. Assume familiarity with VS Code, extensions, and development workflows.
|
||||
|
||||
#### 5. **Show, Don't Just Tell**
|
||||
Every feature explanation needs a realistic code example. Make examples copy-pasteable and immediately useful. Avoid "Hello World" demos—use real-world scenarios.
|
||||
|
||||
#### 6. **Cognitive Accessibility First**
|
||||
- Use parallel structure in lists
|
||||
- Define technical terms when they impact understanding
|
||||
- Provide context for complex workflows
|
||||
- Break complex tasks into numbered steps
|
||||
- Use consistent terminology throughout
|
||||
|
||||
#### 7. **Anticipate and Address**
|
||||
Include common pitfalls, troubleshooting tips, and "gotchas" within relevant sections. Answer the question users will have next.
|
||||
|
||||
#### 8. **Internal Navigation Standards**
|
||||
- Use absolute paths starting from `/docs/` root
|
||||
- Omit `.md` extensions in links
|
||||
- Example: `[Configuration Guide](/configuration/setup/)`
|
||||
- Test all links work in Docusaurus environment
|
||||
|
||||
#### 9. **@site Alias Usage**
|
||||
- Use `@site` only for code imports and component references
|
||||
- Example: `import Header from '@site/src/components/Header';`
|
||||
- Never use `@site` in Markdown links—use absolute paths instead
|
||||
|
||||
#### 10. **Code Standards**
|
||||
- Provide syntax highlighting for all code blocks
|
||||
- Include file names or context when helpful
|
||||
- Maintain consistent indentation (2 spaces)
|
||||
- Test code examples before publishing
|
||||
- Show input AND expected output when relevant
|
||||
|
||||
#### 11. **Visual Elements**
|
||||
- Add image placeholders with descriptive alt text
|
||||
- Use format: `<img src="/img/folder/filename.png" alt="Descriptive text" width="600" />`
|
||||
- Images should start with `/img/` path
|
||||
- Include brief description below complex images
|
||||
|
||||
#### 12. **Eliminate Filler Words**
|
||||
Remove: "simply," "just," "easily," "obviously," "of course," "as you can see." These add cognitive load without value.
|
||||
|
||||
#### 13. **Progressive Disclosure**
|
||||
Start with the essential information. Add detail as needed. Use expandable sections or links to deeper content for advanced users.
|
||||
|
||||
#### 14. **Consistency Checklist**
|
||||
- Use same terminology for same concepts
|
||||
- Follow identical formatting patterns
|
||||
- Maintain consistent voice and tone
|
||||
- Verify all links and code examples work
|
||||
- Check accessibility with screen reader preview
|
||||
|
||||
groups:
|
||||
- read
|
||||
- command
|
||||
- edit
|
||||
source: project
|
||||
|
||||
- slug: posts
|
||||
name: Blog Post Author
|
||||
roleDefinition: You are a technical blog author who applies Smart Brevity principles to make complex development topics accessible and engaging. With 24 years of experience, you write with authentic candor and technical precision, helping developers quickly understand why they should care about Kilo Code features. Your friendly, conversational tone includes light humor while maintaining professional credibility. You specialize in translating documentation into compelling stories that show real-world value, always leading with the problem being solved rather than the solution being offered.
|
||||
customInstructions: >-
|
||||
### Smart Brevity Blog Standards
|
||||
|
||||
#### 1. **Hook with Value** (Smart Brevity Core)
|
||||
Open every post by stating the problem this feature/topic solves. Lead with "why this matters" before explaining "what it does." Make the value clear in the first paragraph.
|
||||
|
||||
#### 2. **One Big Thing Focus**
|
||||
Each blog post should have one main takeaway readers can act on immediately. State it early and reinforce it throughout.
|
||||
|
||||
#### 3. **Scannable and Engaging**
|
||||
- Use subheadings that ask questions or promise benefits
|
||||
- Keep paragraphs short (2-3 sentences max)
|
||||
- Include bullet points for key benefits or steps
|
||||
- Add light humor or personality without compromising clarity
|
||||
- Bold important concepts and features
|
||||
|
||||
#### 4. **Real-World Context**
|
||||
Show how experienced developers actually use these features. Skip toy examples—demonstrate genuine productivity gains and workflow improvements.
|
||||
|
||||
#### 5. **Documentation Integration**
|
||||
- Link to relevant docs using absolute URLs
|
||||
- Example: `[Complete Setup Guide](https://kilocode.ai/docs/configuration/)`
|
||||
- Reference specific documentation sections to drive deeper engagement
|
||||
- Make it easy to go from blog interest to documentation action
|
||||
|
||||
#### 6. **Accessible Technical Writing**
|
||||
- Define acronyms and technical terms when they impact understanding
|
||||
- Use parallel structure in lists and explanations
|
||||
- Provide context for workflows and processes
|
||||
- Consider readers with varying attention spans and learning styles
|
||||
|
||||
#### 7. **Problem-Solution Structure**
|
||||
- Start with relatable developer pain point
|
||||
- Show how Kilo Code addresses it specifically
|
||||
- Provide concrete example or walkthrough
|
||||
- End with clear next steps or call to action
|
||||
|
||||
#### 8. **Code with Context**
|
||||
- Include realistic, copy-pasteable code examples
|
||||
- Show before/after scenarios when relevant
|
||||
- Provide syntax highlighting and proper formatting
|
||||
- Explain why the code works, not just how
|
||||
|
||||
#### 9. **Visual Storytelling**
|
||||
- Use images from documentation: `<img src="https://kilocode.ai/docs/img/folder/filename.png" alt="Description" width="600" />`
|
||||
- Include screenshots that support the narrative
|
||||
- Add brief descriptions for complex visuals
|
||||
- Show UI paths with backticks: `Settings → Prompts → Feature Name`
|
||||
|
||||
#### 10. **Friendly Authority**
|
||||
- Write conversationally but maintain technical credibility
|
||||
- Include 1-2 appropriate jokes or light observations per post
|
||||
- Acknowledge common frustrations developers face
|
||||
- Share insights from real usage patterns
|
||||
|
||||
#### 11. **Clear Navigation**
|
||||
- End posts with specific next steps
|
||||
- Link to relevant documentation sections
|
||||
- Suggest related features or workflows
|
||||
- Make it easy for readers to continue their journey
|
||||
|
||||
#### 12. **Elimination Editing**
|
||||
Remove marketing speak, unnecessary qualifiers, and filler words. Every sentence should advance understanding or provide value.
|
||||
|
||||
groups:
|
||||
- read
|
||||
- edit
|
||||
source: project
|
||||
@@ -1,31 +0,0 @@
|
||||
# Kilo Code Documentation Rules
|
||||
|
||||
## Documentation Links
|
||||
- Do not include .md extensions in documentation links
|
||||
- Use absolute paths starting from the `/docs/` root for internal documentation links
|
||||
- Example: [link text](/basic-usage/how-tools-work) NOT [link text](basic-usage/how-tools-work.md) or [link text](../../basic-usage/how-tools-work)
|
||||
|
||||
This ensures links work correctly in the built documentation while maintaining clean URLs.
|
||||
|
||||
## Image References
|
||||
- Use `/docs/img/` prefix for all image paths in documentation
|
||||
- Example: `<img src="/docs/img/your-first-task/example.png" alt="Description" width="600" />`
|
||||
- NOT: `<img src="img/example.png" ...>` or `<img src="../static/img/example.png" ...>`
|
||||
|
||||
## Component Imports
|
||||
- Import custom components from `@site/src/components/` using absolute paths
|
||||
- Import constants from `@site/src/constants.ts`
|
||||
- Examples:
|
||||
- `import Image from '@site/src/components/Image';`
|
||||
- `import { DISCORD_URL } from '@site/src/constants.ts'`
|
||||
- `import Codicon from '@site/src/components/Codicon';`
|
||||
|
||||
## External Link References
|
||||
- Use constants from `src/constants.ts` for external URLs instead of hardcoding
|
||||
- Example: `<a href={DISCORD_URL} target="_blank">Discord</a>`
|
||||
- NOT: `<a href="https://kilocode.ai/discord">Discord</a>`
|
||||
|
||||
## Sidebar Configuration
|
||||
- Document IDs in `sidebars.ts` should match file paths without extensions
|
||||
- Use `type: 'doc'` with custom labels when the sidebar label differs from the document title
|
||||
- Group related documents under categories with descriptive labels
|
||||
@@ -1,201 +0,0 @@
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
@@ -1,17 +1,55 @@
|
||||
# Kilo Code Docs
|
||||
# Full Next.js example
|
||||
|
||||
This website is built using [Docusaurus](https://docusaurus.io/), a modern static website generator, and lives at https://kilocode.ai/docs
|
||||
This is a full-featured boilerplate for a creating a documentation website using Markdoc and Next.js.
|
||||
|
||||
### Installation
|
||||
<img width="2032" alt="image" src="https://user-images.githubusercontent.com/62121649/174916143-16f18270-0463-402c-8b48-33c627ea7a7e.png">
|
||||
|
||||
```
|
||||
$ pnpm install
|
||||
## Setup
|
||||
|
||||
First, clone this repo and install the dependencies required:
|
||||
|
||||
```bash
|
||||
npm install
|
||||
# or
|
||||
yarn install
|
||||
```
|
||||
|
||||
### Local Development
|
||||
Then, run the development server:
|
||||
|
||||
```
|
||||
$ pnpm docs:start
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
```
|
||||
|
||||
This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `index.md`. The page auto-updates as you edit the file.
|
||||
|
||||
## Deploy
|
||||
|
||||
The quickest way to deploy your own version of this boilerplate is by deploying it with [Vercel](https://vercel.com) or [Netlify](https://www.netlify.com/) by clicking one of the buttons below.
|
||||
|
||||
### Deploy with Vercel
|
||||
|
||||
[](https://vercel.com/new/clone?repository-url=https://github.com/markdoc/next.js-starter)
|
||||
|
||||
### Deploy to Netlify
|
||||
|
||||
[](https://app.netlify.com/start/deploy?repository=https://github.com/markdoc/next.js-starter)
|
||||
|
||||
## Contributing
|
||||
|
||||
When making documentation _only_ changes, use branch names prefixed with `docs/`:
|
||||
|
||||
```bash
|
||||
git checkout -b docs/your-change-description
|
||||
```
|
||||
|
||||
Examples:
|
||||
|
||||
- `docs/add-mcp-tutorial`
|
||||
- `docs/fix-installation-steps`
|
||||
- `docs/update-api-reference`
|
||||
|
||||
For full contribution guidelines, see the [Contributing Guide](https://kilo.ai/docs/contributing).
|
||||
|
||||
@@ -0,0 +1,137 @@
|
||||
/**
|
||||
* Tests for redirect loop detection in previous-docs-redirects.js
|
||||
*
|
||||
* This test suite verifies that the redirect configuration has no loops:
|
||||
* 1. Direct loops: A path redirecting to itself (source === destination)
|
||||
* 2. Indirect loops: A chain of redirects leading back to a starting point (A → B → C → A)
|
||||
*/
|
||||
|
||||
import { expect, describe, it } from "vitest"
|
||||
import redirects from "../previous-docs-redirects.js"
|
||||
|
||||
interface Redirect {
|
||||
source: string
|
||||
destination: string
|
||||
basePath?: boolean
|
||||
permanent?: boolean
|
||||
}
|
||||
|
||||
describe("previous-docs-redirects", () => {
|
||||
describe("direct loop detection", () => {
|
||||
it("should not have any redirects where source equals destination", () => {
|
||||
const directLoops: Redirect[] = []
|
||||
|
||||
for (const redirect of redirects as Redirect[]) {
|
||||
if (redirect.source === redirect.destination) {
|
||||
directLoops.push(redirect)
|
||||
}
|
||||
}
|
||||
|
||||
if (directLoops.length > 0) {
|
||||
const loopDetails = directLoops.map((r) => ` - "${r.source}" redirects to itself`).join("\n")
|
||||
expect.fail(`Found ${directLoops.length} direct redirect loop(s):\n${loopDetails}`)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
describe("indirect loop detection", () => {
|
||||
it("should not have any redirect chains that form a cycle", () => {
|
||||
// Build a map of source -> destination for quick lookup
|
||||
// Note: We only consider exact path matches, not wildcard patterns like :path*
|
||||
// Also skip direct loops (source === destination) as they're caught by the direct loop test
|
||||
const redirectMap = new Map<string, string>()
|
||||
|
||||
for (const redirect of redirects as Redirect[]) {
|
||||
// Skip wildcard redirects as they don't form exact chains
|
||||
// Skip direct loops as they're caught by the direct loop test
|
||||
if (
|
||||
!redirect.source.includes(":") &&
|
||||
!redirect.source.includes("*") &&
|
||||
redirect.source !== redirect.destination
|
||||
) {
|
||||
redirectMap.set(redirect.source, redirect.destination)
|
||||
}
|
||||
}
|
||||
|
||||
const cycles: string[][] = []
|
||||
|
||||
/**
|
||||
* Detects if following redirects from a starting path leads back to any path in the chain.
|
||||
* Uses a visited set to track the current chain and detect cycles.
|
||||
*/
|
||||
function detectCycle(startPath: string): string[] | null {
|
||||
const visited = new Set<string>()
|
||||
const chain: string[] = [startPath]
|
||||
let currentPath = startPath
|
||||
|
||||
while (redirectMap.has(currentPath)) {
|
||||
const nextPath = redirectMap.get(currentPath)!
|
||||
|
||||
if (visited.has(nextPath)) {
|
||||
// Found a cycle - return the chain from the cycle start
|
||||
const cycleStartIndex = chain.indexOf(nextPath)
|
||||
if (cycleStartIndex !== -1) {
|
||||
return [...chain.slice(cycleStartIndex), nextPath]
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
visited.add(currentPath)
|
||||
chain.push(nextPath)
|
||||
currentPath = nextPath
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
// Check each redirect source for potential cycles
|
||||
for (const source of redirectMap.keys()) {
|
||||
const cycle = detectCycle(source)
|
||||
if (cycle) {
|
||||
// Avoid duplicate cycle reports by checking if we've already found this cycle
|
||||
const cycleKey = [...cycle].sort().join(" -> ")
|
||||
const isDuplicate = cycles.some(
|
||||
(existingCycle) => [...existingCycle].sort().join(" -> ") === cycleKey,
|
||||
)
|
||||
if (!isDuplicate) {
|
||||
cycles.push(cycle)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (cycles.length > 0) {
|
||||
const cycleDetails = cycles.map((cycle) => ` - ${cycle.join(" → ")}`).join("\n")
|
||||
expect.fail(`Found ${cycles.length} indirect redirect cycle(s):\n${cycleDetails}`)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
describe("redirect structure validation", () => {
|
||||
it("should have valid redirect objects with required properties", () => {
|
||||
const invalidRedirects: { index: number; issues: string[] }[] = []
|
||||
|
||||
;(redirects as Redirect[]).forEach((redirect, index) => {
|
||||
const issues: string[] = []
|
||||
|
||||
if (typeof redirect.source !== "string" || redirect.source.trim() === "") {
|
||||
issues.push("missing or invalid 'source' property")
|
||||
}
|
||||
|
||||
if (typeof redirect.destination !== "string" || redirect.destination.trim() === "") {
|
||||
issues.push("missing or invalid 'destination' property")
|
||||
}
|
||||
|
||||
if (issues.length > 0) {
|
||||
invalidRedirects.push({ index, issues })
|
||||
}
|
||||
})
|
||||
|
||||
if (invalidRedirects.length > 0) {
|
||||
const details = invalidRedirects
|
||||
.map((r) => ` - Redirect at index ${r.index}: ${r.issues.join(", ")}`)
|
||||
.join("\n")
|
||||
expect.fail(`Found ${invalidRedirects.length} invalid redirect(s):\n${details}`)
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,106 +0,0 @@
|
||||
# Why I Let AI Write My Commit Messages
|
||||
### And Probably You Should Too
|
||||
|
||||
I've just finished implementing a big feature, the code is staged and ready to go, but there I am — mesmerized by the empty commit message field, brain is blank. What do I write? "Fixed stuff"? "Updates"? "asdf"? Do you know that feeling too?
|
||||
|
||||
I've been there countless times, and honestly, it's one of those tiny friction points that really bother me - or, better to say, bothered me, because since we shipped `auto-generate commit messages feature`, the problem disappeared for good. That feature became one of those things where once I have it, I wonder how I ever lived without it.
|
||||
|
||||
## The Problem with Commit Messages
|
||||
|
||||
**Writing good commit messages is hard.** Like, genuinely difficult. You need to:
|
||||
|
||||
- Summarize what changed without being too vague
|
||||
- Follow your team's conventions (Conventional Commits, anyone?)
|
||||
- Capture the *why* behind the change, which is often harder than the *what*
|
||||
- Keep it concise but informative
|
||||
- Do all this while your brain is already moving on to the coffee machine
|
||||
|
||||
The result? Most of us end up with commit histories that look like something between an archaeological mystery and a stand-up show. Future you (or your teammates) trying to understand why something was changed becomes an exercise in detective work.
|
||||
|
||||
## How It Actually Works
|
||||
|
||||
Here's the thing that makes this feature genuinely useful: it only looks at your **staged changes**. Not your entire working directory, not random files you've been tinkering with—just the specific changes you've decided to commit.
|
||||
|
||||
This is crucial because it means the AI understands the scope of what you're actually committing. It can see that you added a new authentication method, fixed a specific bug, or updated documentation, and it crafts the message accordingly.
|
||||
|
||||
The process is dead simple:
|
||||
1. Stage your changes (like you normally would)
|
||||
2. Click the Kilo Code logo next to the commit message field
|
||||
3. Get a properly formatted commit message - automagically!
|
||||
|
||||
<img src="https://kilocode.ai/docs/img/git-commit-generation/git-commit-1.png" alt="Auto-generated commit message in VS Code" width="600" />
|
||||
|
||||
## Real Examples from Real Work
|
||||
|
||||
Let me show you some actual commit messages this feature has generated for me:
|
||||
|
||||
```
|
||||
feat(auth): implement OAuth2 integration with GitHub
|
||||
|
||||
Add GitHub OAuth2 authentication flow including:
|
||||
- OAuth2 client configuration
|
||||
- User profile retrieval
|
||||
- Token refresh mechanism
|
||||
```
|
||||
|
||||
```
|
||||
fix(api): resolve race condition in user session handling
|
||||
|
||||
Add proper locking mechanism to prevent concurrent
|
||||
session updates from causing data corruption
|
||||
```
|
||||
|
||||
```
|
||||
docs(readme): update installation requirements
|
||||
|
||||
Clarify Node.js version requirements and add
|
||||
troubleshooting section for common setup issues
|
||||
```
|
||||
|
||||
Notice how these follow [Conventional Commits](https://www.conventionalcommits.org/) format by default? That's not an accident. The feature understands modern commit conventions best practices and applying them automatically.
|
||||
|
||||
## The Customization That Actually Matters
|
||||
|
||||
Here's where it gets interesting. You can customize the prompt template to match your team's specific needs or your own preferences. Don't want to be "too conventional" or just have your own standards? Maybe you want to use a different commit format, or you want to include ticket numbers, your git username or you have specific terminology for your project?
|
||||
|
||||
Just head to `Settings → Prompts → Commit Message Generation` and modify the template. The AI will adapt to your requirements while still understanding the technical context of your changes.
|
||||
|
||||
<img src="https://kilocode.ai/docs/img/git-commit-generation/git-commit-2.png" alt="Customizing commit message templates" width="600" />
|
||||
|
||||
## Why This Isn't Just Another AI Gimmick
|
||||
|
||||
I've seen plenty of AI features that feel like solutions looking for problems. This isn't one of them, it actually works:
|
||||
|
||||
**It's contextually aware**: The AI sees your actual code changeset, not just filenames. It understands when you've added error handling, refactored a function, or fixed a typo.
|
||||
|
||||
**It respects your workflow**: You still stage changes the same way. You still review and edit the message if needed. It just removes the blank-page problem.
|
||||
|
||||
**It's fast**: No waiting around for some cloud service to analyze your entire codebase. It's quick and focused.
|
||||
|
||||
**It follows your patterns**: The more you adjust it, the better it gets at matching your project's style and conventions.
|
||||
|
||||
## The Productivity Impact
|
||||
|
||||
Here's the thing I didn't expect: this feature doesn't just save time on writing commit messages. It actually makes me commit more frequently and more conciously.
|
||||
|
||||
When writing commit messages was a friction point, I'd sometimes batch unrelated changes together just to avoid writing multiple messages. Just squeeze everything into a bucket and throw it at the server, like `git add . && git commit -m "blablabla" && git push`. Now, I commit logical chunks of work as I complete them, which leads to a much cleaner git history.
|
||||
|
||||
Better commit messages also mean better code reviews. When your teammates can quickly understand what each commit does, the entire review process becomes more efficient.
|
||||
|
||||
## Getting Started
|
||||
|
||||
The feature is available in Kilo Code since `v4.35` and became customizable in `v4.38`. Just make sure you have some staged changes, and look for the Kilo Code logo in your VS Code Source Control panel.
|
||||
|
||||
Pro tip: Consider setting up a dedicated [API configuration profile](https://kilocode.ai/docs/features/api-configuration-profiles/) with a faster, cheaper model specifically for commit message generation. You don't need the most powerful model for this task, and it'll save you some API costs and time - yes, it's exactly what we did in [2x Faster, 30x Cheaper Prompt Enhancement](https://blog.kilocode.ai/p/2x-faster-prompt-enhancement-in-kilo)!
|
||||
|
||||
## One More Thing
|
||||
|
||||
I mentioned I use this feature constantly, and that's not hyperbole. It's become such a natural part of my workflow that I actually get annoyed when I have to write commit messages manually.
|
||||
|
||||
That's the mark of a good tool — when it "dissolves" into your workflow and just makes everything smoother. No fanfare, just one less thing to think about so you can focus on what actually matters: writing great code.
|
||||
|
||||
Give it a try. I think you'll find yourself wondering how you ever managed without it.
|
||||
|
||||
---
|
||||
|
||||
*Want to learn more about Kilo Code's commit message generation? Check out the [full documentation](https://kilocode.ai/docs/basic-usage/git-commit-generation/) I wrote for setup details. And let me know what you think about it or how could we improve it even more here in comments or on our [Discord Server](https://kilo.love/discord)!*
|
||||
@@ -0,0 +1,115 @@
|
||||
import * as React from "react"
|
||||
|
||||
type CalloutType = "generic" | "note" | "tip" | "info" | "warning" | "danger"
|
||||
|
||||
interface CalloutProps {
|
||||
type?: CalloutType
|
||||
title?: string
|
||||
collapsed?: boolean
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
const typeConfig: Record<
|
||||
CalloutType,
|
||||
{
|
||||
icon: string | null
|
||||
defaultTitle: string | null
|
||||
borderColor: string
|
||||
bgColor: string
|
||||
titleColor: string
|
||||
iconColor: string
|
||||
}
|
||||
> = {
|
||||
generic: {
|
||||
icon: null,
|
||||
defaultTitle: null,
|
||||
borderColor: "border-l-gray-300 dark:border-l-gray-600",
|
||||
bgColor: "bg-gray-50 dark:bg-gray-800/50",
|
||||
titleColor: "text-gray-700 dark:text-gray-300",
|
||||
iconColor: "text-gray-400",
|
||||
},
|
||||
note: {
|
||||
icon: "📝",
|
||||
defaultTitle: "Note",
|
||||
borderColor: "border-l-gray-500",
|
||||
bgColor: "bg-gray-50 dark:bg-gray-800/50",
|
||||
titleColor: "text-gray-700 dark:text-gray-300",
|
||||
iconColor: "text-gray-500",
|
||||
},
|
||||
tip: {
|
||||
icon: "💡",
|
||||
defaultTitle: "Tip",
|
||||
borderColor: "border-l-green-500",
|
||||
bgColor: "bg-green-50 dark:bg-green-900/20",
|
||||
titleColor: "text-green-700 dark:text-green-400",
|
||||
iconColor: "text-green-500",
|
||||
},
|
||||
info: {
|
||||
icon: "ℹ️",
|
||||
defaultTitle: "Info",
|
||||
borderColor: "border-l-blue-500",
|
||||
bgColor: "bg-blue-50 dark:bg-blue-900/20",
|
||||
titleColor: "text-blue-700 dark:text-blue-400",
|
||||
iconColor: "text-blue-500",
|
||||
},
|
||||
warning: {
|
||||
icon: "⚠️",
|
||||
defaultTitle: "Warning",
|
||||
borderColor: "border-l-yellow-500",
|
||||
bgColor: "bg-yellow-50 dark:bg-yellow-900/20",
|
||||
titleColor: "text-yellow-700 dark:text-yellow-400",
|
||||
iconColor: "text-yellow-500",
|
||||
},
|
||||
danger: {
|
||||
icon: "🚨",
|
||||
defaultTitle: "Danger",
|
||||
borderColor: "border-l-red-500",
|
||||
bgColor: "bg-red-50 dark:bg-red-900/20",
|
||||
titleColor: "text-red-700 dark:text-red-400",
|
||||
iconColor: "text-red-500",
|
||||
},
|
||||
}
|
||||
|
||||
export function Callout({ type = "note", title, collapsed = false, children }: CalloutProps) {
|
||||
const [isExpanded, setIsExpanded] = React.useState(!collapsed)
|
||||
const config = typeConfig[type]
|
||||
const displayTitle = title ?? config.defaultTitle
|
||||
const showHeader = displayTitle || config.icon
|
||||
|
||||
// If collapsed prop is set, make the header clickable
|
||||
if (collapsed) {
|
||||
return (
|
||||
<div className={`my-4 border-l-4 ${config.borderColor} ${config.bgColor} rounded-r-lg p-4`}>
|
||||
{showHeader && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setIsExpanded(!isExpanded)}
|
||||
className={`flex items-center gap-2 font-semibold ${config.titleColor} w-full text-left cursor-pointer ${isExpanded ? "mb-2" : ""}`}
|
||||
aria-expanded={isExpanded}>
|
||||
<span
|
||||
className={`transition-transform duration-200 ${isExpanded ? "rotate-90" : ""}`}
|
||||
aria-hidden="true">
|
||||
▶
|
||||
</span>
|
||||
{config.icon && <span className={config.iconColor}>{config.icon}</span>}
|
||||
{displayTitle && <span className="uppercase text-sm tracking-wide">{displayTitle}</span>}
|
||||
</button>
|
||||
)}
|
||||
{isExpanded && <div className="text-gray-700 dark:text-gray-300 [&>p]:m-0">{children}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// Default non-collapsible behavior
|
||||
return (
|
||||
<div className={`my-4 border-l-4 ${config.borderColor} ${config.bgColor} rounded-r-lg p-4`}>
|
||||
{showHeader && (
|
||||
<div className={`flex items-center gap-2 font-semibold ${config.titleColor} mb-2`}>
|
||||
{config.icon && <span className={config.iconColor}>{config.icon}</span>}
|
||||
{displayTitle && <span className="uppercase text-sm tracking-wide">{displayTitle}</span>}
|
||||
</div>
|
||||
)}
|
||||
<div className="text-gray-700 dark:text-gray-300 [&>p]:m-0">{children}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
import React from "react"
|
||||
import "@vscode/codicons/dist/codicon.css"
|
||||
|
||||
interface CodiconProps {
|
||||
name: string
|
||||
size?: string
|
||||
className?: string
|
||||
}
|
||||
|
||||
export function Codicon({ name, size = "1em", className = "" }: CodiconProps) {
|
||||
return (
|
||||
<i
|
||||
className={`codicon codicon-${name} ${className}`.trim()}
|
||||
style={{
|
||||
fontSize: size,
|
||||
verticalAlign: "middle",
|
||||
display: "inline",
|
||||
}}
|
||||
aria-hidden="true"
|
||||
/>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,145 @@
|
||||
import React, { useState, useEffect } from "react"
|
||||
import { useRouter } from "next/router"
|
||||
|
||||
interface CopyPageButtonProps {
|
||||
className?: string
|
||||
}
|
||||
|
||||
export function CopyPageButton({ className }: CopyPageButtonProps) {
|
||||
const router = useRouter()
|
||||
const [copied, setCopied] = useState(false)
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
|
||||
// Reset copied state after 3 seconds
|
||||
useEffect(() => {
|
||||
if (copied) {
|
||||
const timer = setTimeout(() => {
|
||||
setCopied(false)
|
||||
}, 3000)
|
||||
return () => clearTimeout(timer)
|
||||
}
|
||||
}, [copied])
|
||||
|
||||
const handleCopy = async () => {
|
||||
if (copied || isLoading) return
|
||||
|
||||
setIsLoading(true)
|
||||
|
||||
try {
|
||||
// Fetch the raw markdown file based on current route
|
||||
// The route path maps to pages/<path>.md
|
||||
const path = router.asPath.split("#")[0].split("?")[0] // Remove hash and query params
|
||||
const mdPath = path === "/" ? "/index" : path
|
||||
|
||||
// Fetch the raw markdown content from the API route
|
||||
const response = await fetch(`/docs/api/raw-markdown?path=${encodeURIComponent(mdPath)}`)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error("Failed to fetch markdown")
|
||||
}
|
||||
|
||||
const markdown = await response.text()
|
||||
|
||||
await navigator.clipboard.writeText(markdown)
|
||||
setCopied(true)
|
||||
} catch (error) {
|
||||
console.error("Failed to copy page:", error)
|
||||
// Even on error, show some feedback
|
||||
setCopied(true)
|
||||
} finally {
|
||||
setIsLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<button
|
||||
onClick={handleCopy}
|
||||
disabled={copied || isLoading}
|
||||
className={`copy-page-button ${copied ? "copied" : ""} ${className || ""}`}
|
||||
aria-label={copied ? "Copied" : "Copy page markdown"}
|
||||
title="Copy page as markdown for use with LLMs">
|
||||
{copied ? (
|
||||
<>
|
||||
<CheckIcon />
|
||||
<span>Copied</span>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<CopyIcon />
|
||||
<span>Copy page</span>
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
<style jsx>{`
|
||||
.copy-page-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.25rem 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
color: var(--text-secondary);
|
||||
background: var(--bg-secondary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.copy-page-button:hover:not(:disabled) {
|
||||
background: var(--bg-tertiary, var(--bg-secondary));
|
||||
color: var(--text-brand);
|
||||
border-color: var(--text-brand);
|
||||
}
|
||||
|
||||
.copy-page-button:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.copy-page-button.copied {
|
||||
color: var(--success-color, #22c55e);
|
||||
border-color: var(--success-color, #22c55e);
|
||||
background: var(--success-bg, rgba(34, 197, 94, 0.1));
|
||||
}
|
||||
`}</style>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
// Copy icon (two overlapping rectangles)
|
||||
function CopyIcon() {
|
||||
return (
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeWidth="1.5"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round">
|
||||
<rect x="5" y="5" width="9" height="9" rx="1.5" />
|
||||
<path d="M2 10V3.5A1.5 1.5 0 0 1 3.5 2H10" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
// Check icon for copied state
|
||||
function CheckIcon() {
|
||||
return (
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeWidth="2"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round">
|
||||
<path d="M3 8.5L6.5 12L13 4" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
import * as React from "react"
|
||||
|
||||
export function Heading({ id = "", level = 1, children, className }) {
|
||||
return React.createElement(
|
||||
`h${level}`,
|
||||
{
|
||||
id,
|
||||
className: ["heading", className].filter(Boolean).join(" "),
|
||||
},
|
||||
children,
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
import React, { useEffect, useState } from "react"
|
||||
|
||||
interface IconProps {
|
||||
src: string
|
||||
srcDark?: string
|
||||
alt?: string
|
||||
size?: string
|
||||
}
|
||||
|
||||
export function Icon({ src, srcDark, alt = "icon", size = "1.2em" }: IconProps) {
|
||||
const [isDark, setIsDark] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
// Check initial dark mode state
|
||||
const checkDarkMode = () => {
|
||||
setIsDark(document.documentElement.classList.contains("dark"))
|
||||
}
|
||||
|
||||
checkDarkMode()
|
||||
|
||||
// Watch for dark mode changes
|
||||
const observer = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
if (mutation.attributeName === "class") {
|
||||
checkDarkMode()
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
observer.observe(document.documentElement, { attributes: true })
|
||||
|
||||
return () => observer.disconnect()
|
||||
}, [])
|
||||
|
||||
const imageSrc = isDark && srcDark ? srcDark : src
|
||||
|
||||
return (
|
||||
<img
|
||||
src={imageSrc}
|
||||
alt={alt}
|
||||
style={{
|
||||
height: size,
|
||||
width: "auto",
|
||||
verticalAlign: "middle",
|
||||
display: "inline",
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
import React from "react"
|
||||
import { Icon } from "./Icon"
|
||||
|
||||
interface KiloCodeIconProps {
|
||||
size?: string
|
||||
}
|
||||
|
||||
export function KiloCodeIcon({ size = "1.2em" }: KiloCodeIconProps) {
|
||||
return <Icon src="/docs/img/kilo-v1.svg" srcDark="/docs/img/kilo-v1-white.svg" alt="Kilo Code Icon" size={size} />
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
import React from "react"
|
||||
|
||||
interface TableProps {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
export function Table({ children }: TableProps) {
|
||||
return (
|
||||
<div className="overflow-x-auto my-6 border border-neutral-300 dark:border-neutral-700 rounded-lg">
|
||||
<table className="w-full border-collapse text-sm">{children}</table>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
interface THeadProps {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
export function THead({ children }: THeadProps) {
|
||||
return <thead className="bg-neutral-100 dark:bg-neutral-800/50">{children}</thead>
|
||||
}
|
||||
|
||||
interface TBodyProps {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
export function TBody({ children }: TBodyProps) {
|
||||
return <tbody className="bg-white dark:bg-neutral-900/50">{children}</tbody>
|
||||
}
|
||||
|
||||
interface TrProps {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
export function Tr({ children }: TrProps) {
|
||||
return <tr className="border-b border-neutral-300 dark:border-neutral-700 last:border-b-0">{children}</tr>
|
||||
}
|
||||
|
||||
interface ThProps {
|
||||
children: React.ReactNode
|
||||
width?: string
|
||||
}
|
||||
|
||||
export function Th({ children, width }: ThProps) {
|
||||
return (
|
||||
<th
|
||||
className="px-4 py-2.5 text-left text-sm font-medium text-neutral-700 dark:text-neutral-300"
|
||||
style={{ width }}>
|
||||
{children}
|
||||
</th>
|
||||
)
|
||||
}
|
||||
|
||||
interface TdProps {
|
||||
children: React.ReactNode
|
||||
colspan?: number
|
||||
rowspan?: number
|
||||
}
|
||||
|
||||
export function Td({ children, colspan, rowspan }: TdProps) {
|
||||
return (
|
||||
<td className="px-4 py-3 text-neutral-600 dark:text-neutral-400" colSpan={colspan} rowSpan={rowspan}>
|
||||
{children}
|
||||
</td>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
import React from "react"
|
||||
import Link from "next/link"
|
||||
|
||||
export function TableOfContents({ toc }) {
|
||||
const items = toc.filter((item) => item.id && (item.level === 2 || item.level === 3))
|
||||
|
||||
if (items.length <= 1) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<nav className="toc">
|
||||
<ul className="flex column">
|
||||
{items.map((item) => {
|
||||
const href = `#${item.id}`
|
||||
const active = typeof window !== "undefined" && window.location.hash === href
|
||||
return (
|
||||
<li
|
||||
key={item.title}
|
||||
className={[active ? "active" : undefined, item.level === 3 ? "padded" : undefined]
|
||||
.filter(Boolean)
|
||||
.join(" ")}>
|
||||
<Link href={href}>{item.title}</Link>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
<style jsx>
|
||||
{`
|
||||
nav {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
max-height: calc(100vh - var(--top-nav-height) - 6rem);
|
||||
width: 100%;
|
||||
align-self: flex-start;
|
||||
margin-bottom: 1rem;
|
||||
padding: 0.5rem 0 0;
|
||||
border-left: 1px solid var(--border-color);
|
||||
transition: border-color 0.2s ease;
|
||||
overflow-y: auto;
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
padding-left: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
li {
|
||||
list-style-type: none;
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
li :global(a) {
|
||||
text-decoration: none;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
li :global(a:hover),
|
||||
li.active :global(a) {
|
||||
text-decoration: underline;
|
||||
}
|
||||
li.padded {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
/* Hide on tablet and mobile */
|
||||
@media (max-width: 1024px) {
|
||||
nav {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
import React, { useState, Children, isValidElement, ReactNode, ReactElement } from "react"
|
||||
|
||||
interface TabProps {
|
||||
label: string
|
||||
children: ReactNode
|
||||
}
|
||||
|
||||
interface TabsProps {
|
||||
children: ReactNode
|
||||
}
|
||||
|
||||
export function Tab({ children }: TabProps) {
|
||||
return <>{children}</>
|
||||
}
|
||||
|
||||
export function Tabs({ children }: TabsProps) {
|
||||
const [activeIndex, setActiveIndex] = useState(0)
|
||||
|
||||
const tabs = Children.toArray(children).filter(
|
||||
(child): child is ReactElement<TabProps> =>
|
||||
isValidElement(child) && (child.type === Tab || (child.props as any)?.label !== undefined),
|
||||
)
|
||||
|
||||
return (
|
||||
<div className="tabs-container my-6 border border-neutral-300 dark:border-neutral-700 rounded-lg overflow-hidden">
|
||||
<div className="tabs-header flex border-b border-neutral-300 dark:border-neutral-700 bg-neutral-100 dark:bg-neutral-800/50 overflow-x-auto">
|
||||
{tabs.map((tab, index) => (
|
||||
<button
|
||||
key={index}
|
||||
className={`px-2 py-2 text-xs sm:px-4 sm:py-2.5 sm:text-sm font-medium transition-colors whitespace-nowrap ${
|
||||
activeIndex === index
|
||||
? "bg-white dark:bg-neutral-900 text-yellow-800 dark:text-yellow-300 border-b-2 border-yellow-800 dark:border-yellow-300 -mb-[1px]"
|
||||
: "text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-200 hover:bg-neutral-200 dark:hover:bg-neutral-700/50"
|
||||
}`}
|
||||
onClick={() => setActiveIndex(index)}>
|
||||
{tab.props.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
<div className="tabs-content p-3 sm:p-4 bg-white dark:bg-neutral-900/50">{tabs[activeIndex]}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,117 @@
|
||||
import React, { useEffect, useState } from "react"
|
||||
|
||||
type Theme = "light" | "dark" | "system"
|
||||
|
||||
export function ThemeToggle() {
|
||||
const [theme, setTheme] = useState<Theme>("system")
|
||||
const [mounted, setMounted] = useState(false)
|
||||
|
||||
// On mount, read the preference from localStorage or default to 'system'
|
||||
useEffect(() => {
|
||||
setMounted(true)
|
||||
const storedTheme = localStorage.getItem("theme") as Theme | null
|
||||
if (storedTheme) {
|
||||
setTheme(storedTheme)
|
||||
}
|
||||
}, [])
|
||||
|
||||
// Apply the theme to the document
|
||||
useEffect(() => {
|
||||
if (!mounted) return
|
||||
|
||||
const root = document.documentElement
|
||||
|
||||
if (theme === "system") {
|
||||
localStorage.removeItem("theme")
|
||||
const systemDark = window.matchMedia("(prefers-color-scheme: dark)").matches
|
||||
root.classList.toggle("dark", systemDark)
|
||||
} else {
|
||||
localStorage.setItem("theme", theme)
|
||||
root.classList.toggle("dark", theme === "dark")
|
||||
}
|
||||
}, [theme, mounted])
|
||||
|
||||
// Listen for system preference changes
|
||||
useEffect(() => {
|
||||
if (!mounted) return
|
||||
|
||||
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)")
|
||||
|
||||
const handleChange = (e: MediaQueryListEvent) => {
|
||||
if (theme === "system") {
|
||||
document.documentElement.classList.toggle("dark", e.matches)
|
||||
}
|
||||
}
|
||||
|
||||
mediaQuery.addEventListener("change", handleChange)
|
||||
return () => mediaQuery.removeEventListener("change", handleChange)
|
||||
}, [theme, mounted])
|
||||
|
||||
const cycleTheme = () => {
|
||||
const themes: Theme[] = ["system", "light", "dark"]
|
||||
const currentIndex = themes.indexOf(theme)
|
||||
const nextIndex = (currentIndex + 1) % themes.length
|
||||
setTheme(themes[nextIndex])
|
||||
}
|
||||
|
||||
// Avoid hydration mismatch by not rendering until mounted
|
||||
if (!mounted) {
|
||||
return (
|
||||
<button className="theme-toggle" aria-label="Toggle theme" style={{ width: "32px", height: "32px" }}>
|
||||
<span style={{ opacity: 0 }}>🌙</span>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
const getIcon = () => {
|
||||
if (theme === "system") {
|
||||
return "💻"
|
||||
}
|
||||
if (theme === "dark") {
|
||||
return "🌙"
|
||||
}
|
||||
return "☀️"
|
||||
}
|
||||
|
||||
const getLabel = () => {
|
||||
if (theme === "system") {
|
||||
return "Using system theme"
|
||||
}
|
||||
if (theme === "dark") {
|
||||
return "Dark mode"
|
||||
}
|
||||
return "Light mode"
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<button onClick={cycleTheme} className="theme-toggle" aria-label={getLabel()} title={getLabel()}>
|
||||
<span>{getIcon()}</span>
|
||||
</button>
|
||||
<style jsx>{`
|
||||
.theme-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 6px;
|
||||
background: var(--bg-secondary);
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
transition:
|
||||
background-color 0.2s ease,
|
||||
border-color 0.2s ease;
|
||||
}
|
||||
.theme-toggle:hover {
|
||||
background: var(--border-color);
|
||||
}
|
||||
.theme-toggle span {
|
||||
line-height: 1;
|
||||
}
|
||||
`}</style>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,91 @@
|
||||
import React from "react"
|
||||
|
||||
interface YouTubeProps {
|
||||
url: string
|
||||
title?: string
|
||||
caption?: string
|
||||
}
|
||||
|
||||
/**
|
||||
* Extracts the YouTube video ID from various URL formats
|
||||
*/
|
||||
function extractVideoId(url: string): string | null {
|
||||
const patterns = [
|
||||
/(?:youtube\.com\/watch\?v=)([^&\s]+)/,
|
||||
/(?:youtube\.com\/embed\/)([^?\s]+)/,
|
||||
/(?:youtu\.be\/)([^?\s]+)/,
|
||||
/(?:youtube\.com\/v\/)([^?\s]+)/,
|
||||
]
|
||||
|
||||
for (const pattern of patterns) {
|
||||
const match = url.match(pattern)
|
||||
if (match) {
|
||||
return match[1]
|
||||
}
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
export function YouTube({ url, title = "YouTube video", caption }: YouTubeProps) {
|
||||
const videoId = extractVideoId(url)
|
||||
|
||||
if (!videoId) {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
padding: "1rem",
|
||||
backgroundColor: "var(--red-100, #fee2e2)",
|
||||
color: "var(--red-700, #b91c1c)",
|
||||
borderRadius: "0.5rem",
|
||||
margin: "1.5rem 0",
|
||||
}}>
|
||||
Invalid YouTube URL: {url}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
maxWidth: "640px",
|
||||
margin: "1.5rem 0",
|
||||
}}>
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
paddingBottom: "56.25%", // 16:9 aspect ratio
|
||||
height: 0,
|
||||
overflow: "hidden",
|
||||
borderRadius: "0.5rem",
|
||||
}}>
|
||||
<iframe
|
||||
src={`https://www.youtube.com/embed/${videoId}`}
|
||||
title={title}
|
||||
style={{
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
border: "none",
|
||||
borderRadius: "0.5rem",
|
||||
}}
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowFullScreen
|
||||
/>
|
||||
</div>
|
||||
{caption && (
|
||||
<figcaption
|
||||
style={{
|
||||
fontStyle: "italic",
|
||||
textAlign: "center",
|
||||
marginTop: "0.5rem",
|
||||
color: "var(--gray-600, #6b7280)",
|
||||
}}>
|
||||
{caption}
|
||||
</figcaption>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
export * from "./Callout"
|
||||
export * from "./CodeBlock"
|
||||
export * from "./Codicon"
|
||||
export * from "./CopyPageButton"
|
||||
export * from "./Heading"
|
||||
export * from "./Icon"
|
||||
export * from "./Image"
|
||||
export * from "./KiloCodeIcon"
|
||||
export * from "./SideNav"
|
||||
export * from "./Table"
|
||||
export * from "./TableOfContents"
|
||||
export * from "./Tabs"
|
||||
export * from "./ThemeToggle"
|
||||
export * from "./TopNav"
|
||||
export * from "./YouTube"
|
||||
@@ -1,240 +0,0 @@
|
||||
# codebase_search
|
||||
|
||||
:::warning Experimental Feature
|
||||
The `codebase_search` tool is that requires additional setup including an embedding provider and vector database.
|
||||
:::
|
||||
|
||||
The `codebase_search` tool performs semantic searches across your entire codebase using AI embeddings. Unlike traditional text-based search, it understands the meaning of your queries and finds relevant code even when exact keywords don't match.
|
||||
|
||||
## Parameters
|
||||
|
||||
The tool accepts these parameters:
|
||||
|
||||
- `query` (required): Natural language search query describing what you're looking for
|
||||
- `path` (optional): Directory path to limit search scope to a specific part of your codebase
|
||||
|
||||
## What It Does
|
||||
|
||||
This tool searches through your indexed codebase using semantic similarity rather than exact text matching. It finds code blocks that are conceptually related to your query, even if they don't contain the exact words you searched for. Results include relevant code snippets with file paths, line numbers, and similarity scores.
|
||||
|
||||
## When is it used?
|
||||
|
||||
- When Kilo Code needs to find code related to specific functionality across your project
|
||||
- When looking for implementation patterns or similar code structures
|
||||
- When searching for error handling, authentication, or other conceptual code patterns
|
||||
- When exploring unfamiliar codebases to understand how features are implemented
|
||||
- When finding related code that might be affected by changes or refactoring
|
||||
|
||||
## Key Features
|
||||
|
||||
- **Semantic Understanding**: Finds code by meaning rather than exact keyword matches
|
||||
- **Cross-Project Search**: Searches across your entire indexed codebase, not just open files
|
||||
- **Contextual Results**: Returns code snippets with file paths and line numbers for easy navigation
|
||||
- **Similarity Scoring**: Results ranked by relevance with similarity scores (0-1 scale)
|
||||
- **Scope Filtering**: Optional path parameter to limit searches to specific directories
|
||||
- **Intelligent Ranking**: Results sorted by semantic relevance to your query
|
||||
- **UI Integration**: Results displayed with syntax highlighting and navigation links
|
||||
- **Performance Optimized**: Fast vector-based search with configurable result limits
|
||||
|
||||
## Requirements
|
||||
|
||||
This tool is only available when the experimental Codebase Indexing feature is properly configured:
|
||||
|
||||
- **Feature Enabled**: Codebase Indexing must be enabled in experimental settings
|
||||
- **Embedding Provider**: OpenAI API key or Ollama configuration required
|
||||
- **Vector Database**: Qdrant instance running and accessible
|
||||
- **Index Status**: Codebase must be indexed (status: "Indexed" or "Indexing")
|
||||
|
||||
## Limitations
|
||||
|
||||
- **Experimental Feature**: Part of the experimental codebase indexing system
|
||||
- **Requires Configuration**: Depends on external services (embedding provider + Qdrant)
|
||||
- **Index Dependency**: Only searches through indexed code blocks
|
||||
- **Result Limits**: Maximum of 50 results per search to maintain performance
|
||||
- **Similarity Threshold**: Only returns results above 0.4 similarity score
|
||||
- **File Size Limits**: Limited to files under 1MB that were successfully indexed
|
||||
- **Language Support**: Effectiveness depends on Tree-sitter language support
|
||||
|
||||
## How It Works
|
||||
|
||||
When the `codebase_search` tool is invoked, it follows this process:
|
||||
|
||||
1. **Availability Validation**:
|
||||
|
||||
- Verifies that the CodeIndexManager is available and initialized
|
||||
- Confirms codebase indexing is enabled in settings
|
||||
- Checks that indexing is properly configured (API keys, Qdrant URL)
|
||||
- Validates the current index state allows searching
|
||||
|
||||
2. **Query Processing**:
|
||||
|
||||
- Takes your natural language query and generates an embedding vector
|
||||
- Uses the same embedding provider configured for indexing (OpenAI or Ollama)
|
||||
- Converts the semantic meaning of your query into a mathematical representation
|
||||
|
||||
3. **Vector Search Execution**:
|
||||
|
||||
- Searches the Qdrant vector database for similar code embeddings
|
||||
- Uses cosine similarity to find the most relevant code blocks
|
||||
- Applies the minimum similarity threshold (0.4) to filter results
|
||||
- Limits results to 50 matches for optimal performance
|
||||
|
||||
4. **Path Filtering** (if specified):
|
||||
|
||||
- Filters results to only include files within the specified directory path
|
||||
- Uses normalized path comparison for accurate filtering
|
||||
- Maintains relevance ranking within the filtered scope
|
||||
|
||||
5. **Result Processing and Formatting**:
|
||||
|
||||
- Converts absolute file paths to workspace-relative paths
|
||||
- Structures results with file paths, line ranges, similarity scores, and code content
|
||||
- Formats for both AI consumption and UI display with syntax highlighting
|
||||
|
||||
6. **Dual Output Format**:
|
||||
- **AI Output**: Structured text format with query, file paths, scores, and code chunks
|
||||
- **UI Output**: JSON format with syntax highlighting and navigation capabilities
|
||||
|
||||
## Search Query Best Practices
|
||||
|
||||
### Effective Query Patterns
|
||||
|
||||
**Good: Conceptual and specific**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>user authentication and password validation</query>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
**Good: Feature-focused**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>database connection pool setup</query>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
**Good: Problem-oriented**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>error handling for API requests</query>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
**Less effective: Too generic**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>function</query>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
### Query Types That Work Well
|
||||
|
||||
- **Functional Descriptions**: "file upload processing", "email validation logic"
|
||||
- **Technical Patterns**: "singleton pattern implementation", "factory method usage"
|
||||
- **Domain Concepts**: "user profile management", "payment processing workflow"
|
||||
- **Architecture Components**: "middleware configuration", "database migration scripts"
|
||||
|
||||
## Directory Scoping
|
||||
|
||||
Use the optional `path` parameter to focus searches on specific parts of your codebase:
|
||||
|
||||
**Search within API modules:**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>endpoint validation middleware</query>
|
||||
<path>src/api</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
**Search in test files:**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>mock data setup patterns</query>
|
||||
<path>tests</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
**Search specific feature directories:**
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>component state management</query>
|
||||
<path>src/components/auth</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
## Result Interpretation
|
||||
|
||||
### Similarity Scores
|
||||
|
||||
- **0.8-1.0**: Highly relevant matches, likely exactly what you're looking for
|
||||
- **0.6-0.8**: Good matches with strong conceptual similarity
|
||||
- **0.4-0.6**: Potentially relevant but may require review
|
||||
- **Below 0.4**: Filtered out as too dissimilar
|
||||
|
||||
### Result Structure
|
||||
|
||||
Each search result includes:
|
||||
|
||||
- **File Path**: Workspace-relative path to the file containing the match
|
||||
- **Score**: Similarity score indicating relevance (0.4-1.0)
|
||||
- **Line Range**: Start and end line numbers for the code block
|
||||
- **Code Chunk**: The actual code content that matched your query
|
||||
|
||||
## Examples When Used
|
||||
|
||||
- When implementing a new feature, Kilo Code searches for "authentication middleware" to understand existing patterns before writing new code.
|
||||
- When debugging an issue, Kilo Code searches for "error handling in API calls" to find related error patterns across the codebase.
|
||||
- When refactoring code, Kilo Code searches for "database transaction patterns" to ensure consistency across all database operations.
|
||||
- When onboarding to a new codebase, Kilo Code searches for "configuration loading" to understand how the application bootstraps.
|
||||
|
||||
## Usage Examples
|
||||
|
||||
Searching for authentication-related code across the entire project:
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>user login and authentication logic</query>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
Finding database-related code in a specific directory:
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>database connection and query execution</query>
|
||||
<path>src/data</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
Looking for error handling patterns in API code:
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>HTTP error responses and exception handling</query>
|
||||
<path>src/api</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
Searching for testing utilities and mock setups:
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>test setup and mock data creation</query>
|
||||
<path>tests</path>
|
||||
</codebase_search>
|
||||
```
|
||||
|
||||
Finding configuration and environment setup code:
|
||||
|
||||
```xml
|
||||
<codebase_search>
|
||||
<query>environment variables and application configuration</query>
|
||||
</codebase_search>
|
||||
```
|
||||
@@ -1,218 +0,0 @@
|
||||
# Custom Rules
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://youtu.be/GF0vjB8NxYg"
|
||||
/>
|
||||
|
||||
Custom rules provide a powerful way to define project-specific and global behaviors and constraints for the Kilo Code AI agent. With custom rules, you can ensure consistent formatting, restrict access to sensitive files, enforce coding standards, and customize the AI's behavior for your specific project needs or across all projects.
|
||||
|
||||
## Overview
|
||||
|
||||
Custom rules allow you to create text-based instructions that all AI models will follow when interacting with your project. These rules act as guardrails and conventions that are consistently respected across all interactions with your codebase. Rules can be managed through both the file system and the built-in UI interface.
|
||||
|
||||
## Rule Format
|
||||
|
||||
Custom rules can be written in plain text, but Markdown format is recommended for better structure and comprehension by the AI models. The structured nature of Markdown helps the models parse and understand your rules more effectively.
|
||||
|
||||
- Use Markdown headers (`#`, `##`, etc.) to define rule categories
|
||||
- Use lists (`-`, `*`) to enumerate specific items or constraints
|
||||
- Use code blocks (``` ```) to include code examples when needed
|
||||
|
||||
## Rule Types
|
||||
|
||||
Kilo Code supports two types of custom rules:
|
||||
|
||||
- **Project Rules**: Apply only to the current project workspace
|
||||
- **Global Rules**: Apply across all projects and workspaces
|
||||
|
||||
:::note UI Support
|
||||
The built-in rules management UI is available for general rules only. Mode-specific rules must be managed through the file system.
|
||||
:::
|
||||
|
||||
## Rule Location
|
||||
|
||||
### Project Rules
|
||||
|
||||
Custom rules are primarily loaded from the **`.kilocode/rules/` directory**. This is the recommended approach for organizing your project-specific rules. Each rule is typically placed in its own Markdown file with a descriptive name:
|
||||
|
||||
```
|
||||
project/
|
||||
├── .kilocode/
|
||||
│ ├── rules/
|
||||
│ │ ├── formatting.md
|
||||
│ │ ├── restricted_files.md
|
||||
│ │ └── naming_conventions.md
|
||||
├── src/
|
||||
└── ...
|
||||
```
|
||||
|
||||
### Global Rules
|
||||
|
||||
Global rules are stored in your home directory and apply to all projects:
|
||||
|
||||
```
|
||||
~/.kilocode/
|
||||
├── rules/
|
||||
│ ├── coding_standards.md
|
||||
│ ├── security_guidelines.md
|
||||
│ └── documentation_style.md
|
||||
```
|
||||
|
||||
## Managing Rules Through the UI
|
||||
|
||||
Kilo Code provides a built-in interface for managing your custom rules without manually editing files in the `.kilocode/rules/` directories. To access the UI, click on the <Codicon name="law" /> icon in the **bottom right corner** of the Kilo Code window.
|
||||
|
||||
You can access the rules management UI to:
|
||||
|
||||
- View all active rules (both project and global)
|
||||
- Toggle rules on/off without deleting them
|
||||
- Create and edit rules directly in the interface
|
||||
- Organize rules by category and priority
|
||||
|
||||
## Rule Loading Order
|
||||
|
||||
### General Rules (Any Mode)
|
||||
|
||||
Rules are loaded in the following priority order:
|
||||
|
||||
1. **Global rules** from `~/.kilocode/rules/` directory
|
||||
2. **Project rules** from `.kilocode/rules/` directory
|
||||
3. **Legacy fallback files** (for backward compatibility):
|
||||
- `.roorules`
|
||||
- `.clinerules`
|
||||
- `.kilocoderules` (deprecated)
|
||||
|
||||
When both global and project rules exist, they are combined with project rules taking precedence over global rules for conflicting directives.
|
||||
|
||||
:::note
|
||||
We strongly recommend keeping your rules in the `.kilocode/rules/` folder as it provides better organization and is the preferred approach for future versions. The folder-based structure allows for more granular rule organization and clearer separation of concerns. The legacy file-based approach is maintained for backward compatibility but may be subject to change in future releases.
|
||||
:::
|
||||
|
||||
### Mode-Specific Rules
|
||||
|
||||
Additionally, the system supports mode-specific rules, which are loaded separately and have their own priority order:
|
||||
|
||||
1. First, it checks for `.kilocode/rules-${mode}/` directory
|
||||
2. If that doesn't exist or is empty, it falls back to `.kilocoderules-${mode}` file (deprecated)
|
||||
|
||||
Currently, mode-specific rules are only supported at the project level.
|
||||
When both generic rules and mode-specific rules exist, the mode-specific rules are given priority in the final output.
|
||||
|
||||
## Creating Custom Rules
|
||||
|
||||
### Using the UI Interface
|
||||
|
||||
<img src="/docs/img/custom-rules/rules-ui.png" alt="Rules tab in Kilo Code" width="400" />
|
||||
|
||||
The easiest way to create and manage rules is through the built-in UI:
|
||||
|
||||
1. Access the rules management interface from the Kilo Code panel
|
||||
2. Choose between creating project-specific or global rules
|
||||
3. Use the interface to create, edit, or toggle rules
|
||||
4. Rules are automatically saved and applied immediately
|
||||
|
||||
### Using the File System
|
||||
|
||||
To create rules manually:
|
||||
|
||||
**For Project Rules:**
|
||||
1. Create the `.kilocode/rules/` directory if it doesn't already exist
|
||||
2. Create a new Markdown file with a descriptive name in this directory
|
||||
3. Write your rule using Markdown formatting
|
||||
4. Save the file
|
||||
|
||||
**For Global Rules:**
|
||||
1. Create the `~/.kilocode/rules/` directory if it doesn't already exist
|
||||
2. Create a new Markdown file with a descriptive name in this directory
|
||||
3. Write your rule using Markdown formatting
|
||||
4. Save the file
|
||||
|
||||
Rules will be automatically applied to all future Kilo Code interactions. Any new changes will be applied immediately.
|
||||
|
||||
## Example Rules
|
||||
|
||||
### Example 1: Table Formatting
|
||||
|
||||
```markdown
|
||||
# Tables
|
||||
When printing tables, always add an exclamation mark to each column header
|
||||
```
|
||||
|
||||
This simple rule instructs the AI to add exclamation marks to all table column headers when generating tables in your project.
|
||||
|
||||
### Example 2: Restricted File Access
|
||||
|
||||
```markdown
|
||||
# Restricted files
|
||||
Files in the list contain sensitive data, they MUST NOT be read
|
||||
- supersecrets.txt
|
||||
- credentials.json
|
||||
- .env
|
||||
```
|
||||
|
||||
This rule prevents the AI from reading or accessing sensitive files, even if explicitly requested to do so.
|
||||
|
||||
<img src="/docs/img/custom-rules/custom-rules.png" alt="Kilo Code ignores request to read sensitive file" width="600" />
|
||||
|
||||
## Use Cases
|
||||
|
||||
Custom rules can be applied to a wide variety of scenarios:
|
||||
|
||||
- **Code Style**: Enforce consistent formatting, naming conventions, and documentation styles
|
||||
- **Security Controls**: Prevent access to sensitive files or directories
|
||||
- **Project Structure**: Define where different types of files should be created
|
||||
- **Documentation Requirements**: Specify documentation formats and requirements
|
||||
- **Testing Patterns**: Define how tests should be structured
|
||||
- **API Usage**: Specify how APIs should be used and documented
|
||||
- **Error Handling**: Define error handling conventions
|
||||
|
||||
## Examples of Custom Rules
|
||||
|
||||
* "Strictly follow code style guide [your project-specific code style guide]"
|
||||
* "Always use spaces for indentation, with a width of 4 spaces"
|
||||
* "Use camelCase for variable names"
|
||||
* "Write unit tests for all new functions"
|
||||
* "Explain your reasoning before providing code"
|
||||
* "Focus on code readability and maintainability"
|
||||
* "Prioritize using the most common library in the community"
|
||||
* "When adding new features to websites, ensure they are responsive and accessible"
|
||||
|
||||
## Best Practices
|
||||
|
||||
- **Be Specific**: Clearly define the scope and intent of each rule
|
||||
- **Use Categories**: Organize related rules under common headers
|
||||
- **Separate Concerns**: Use different files for different types of rules
|
||||
- **Use Examples**: Include examples to illustrate the expected behavior
|
||||
- **Keep It Simple**: Rules should be concise and easy to understand
|
||||
- **Update Regularly**: Review and update rules as project requirements change
|
||||
|
||||
:::tip Pro Tip: File-Based Team Standards
|
||||
When working in team environments, placing `.kilocode/rules/codestyle.md` files under version control allows you to standardize Kilo's behavior across your entire development team. This ensures consistent code style, documentation practices, and development workflows for everyone on the project.
|
||||
:::
|
||||
|
||||
## Limitations
|
||||
|
||||
- Rules are applied on a best-effort basis by the AI models
|
||||
- Complex rules may require multiple examples for clear understanding
|
||||
- Project rules apply only to the project in which they are defined
|
||||
- Global rules apply across all projects
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
If your custom rules aren't being properly followed:
|
||||
|
||||
1. **Check rule status in the UI**: Use the rules management interface to verify that your rules are active and properly loaded
|
||||
1. **Verify rule formatting**: Ensure that your rules are properly formatted with clear Markdown structure
|
||||
1. **Check rule locations**: Ensure that your rules are located in supported locations:
|
||||
- Global rules: `~/.kilocode/rules/` directory
|
||||
- Project rules: `.kilocode/rules/` directory
|
||||
- Legacy files: `.kilocoderules`, `.roorules`, or `.clinerules`
|
||||
1. **Rule specificity**: Verify that the rules are specific and unambiguous
|
||||
1. **Restart VS Code**: Restart VS Code to ensure the rules are properly loaded
|
||||
|
||||
## Related Features
|
||||
|
||||
- [Custom Modes](/docs/features/custom-modes)
|
||||
- [Custom Instructions](/advanced-usage/custom-instructions)
|
||||
- [Settings Management](/docs/features/settings-management)
|
||||
- [Auto-Approval Settings](/docs/features/auto-approving-actions)
|
||||
@@ -1,283 +0,0 @@
|
||||
---
|
||||
sidebar_label: Free & Budget Models
|
||||
---
|
||||
|
||||
# Using Kilo Code for Free and on a Budget
|
||||
|
||||
**Why this matters:** AI model costs can add up quickly during development. This guide shows you how to use Kilo Code effectively while minimizing or eliminating costs through free models, budget-friendly alternatives, and smart usage strategies.
|
||||
|
||||
## Completely Free Options
|
||||
|
||||
### Grok Code Fast 1
|
||||
|
||||
This frontier AI model is 100% free in Kilo Code for a limited time. [See the blog post for more details](https://blog.kilocode.ai/p/grok-code-fast-get-this-frontier-ai-model-free).
|
||||
|
||||
### OpenRouter Free Tier Models
|
||||
|
||||
OpenRouter offers several models with generous free tiers. **Note:** You'll need to create a free OpenRouter account to access these models.
|
||||
|
||||
**Setup:**
|
||||
|
||||
1. Create a free [OpenRouter account](https://openrouter.ai)
|
||||
2. Get your API key from the dashboard
|
||||
3. Configure Kilo Code with the OpenRouter provider
|
||||
|
||||
**Available free models:**
|
||||
|
||||
- **Qwen3 Coder (free)** - Optimized for agentic coding tasks such as function calling, tool use, and long-context reasoning over repositories.
|
||||
- **Z.AI: GLM 4.5 Air (free)** - Lightweight variant of the GLM-4.5 family, purpose-built for agent-centric applications.
|
||||
- **DeepSeek: R1 0528 (free)** - Performance on par with OpenAI o1, but open-sourced and with fully open reasoning tokens.
|
||||
- **MoonshotAI: Kimi K2 (free)** - Optimized for agentic capabilities, including advanced tool use, reasoning, and code synthesis.
|
||||
|
||||
## Cost-Effective Premium Models
|
||||
|
||||
When you need more capability than free models provide, these options deliver excellent value:
|
||||
|
||||
### Ultra-Budget Champions (Under $0.50 per million tokens)
|
||||
|
||||
**Mistral Devstral Small**
|
||||
|
||||
- **Cost:** ~$0.20 per million input tokens
|
||||
- **Best for:** Code generation, debugging, refactoring
|
||||
- **Performance:** 85% of premium model capability at 10% of the cost
|
||||
|
||||
**Llama 4 Maverick**
|
||||
|
||||
- **Cost:** ~$0.30 per million input tokens
|
||||
- **Best for:** Complex reasoning, architecture planning
|
||||
- **Performance:** Excellent for most development tasks
|
||||
|
||||
**DeepSeek v3**
|
||||
|
||||
- **Cost:** ~$0.27 per million input tokens
|
||||
- **Best for:** Code analysis, large codebase understanding
|
||||
- **Performance:** Strong technical reasoning
|
||||
|
||||
### Mid-Range Value Models ($0.50-$2.00 per million tokens)
|
||||
|
||||
**Qwen3 235B**
|
||||
|
||||
- **Cost:** ~$1.20 per million input tokens
|
||||
- **Best for:** Complex projects requiring high accuracy
|
||||
- **Performance:** Near-premium quality at 40% of the cost
|
||||
|
||||
## Smart Usage Strategies
|
||||
|
||||
### The 50% Rule
|
||||
|
||||
**Principle:** Use budget models for 50% of your tasks, premium models for the other 50%.
|
||||
|
||||
**Budget model tasks:**
|
||||
|
||||
- Code reviews and analysis
|
||||
- Documentation writing
|
||||
- Simple bug fixes
|
||||
- Boilerplate generation
|
||||
- Refactoring existing code
|
||||
|
||||
**Premium model tasks:**
|
||||
|
||||
- Complex architecture decisions
|
||||
- Debugging difficult issues
|
||||
- Performance optimization
|
||||
- New feature design
|
||||
- Critical production code
|
||||
|
||||
### Context Management for Cost Savings
|
||||
|
||||
**Minimize context size:**
|
||||
|
||||
```typescript
|
||||
// Instead of mentioning entire files
|
||||
@src/components/UserProfile.tsx
|
||||
|
||||
// Mention specific functions or sections
|
||||
@src/components/UserProfile.tsx:45-67
|
||||
```
|
||||
|
||||
**Use Memory Bank effectively:**
|
||||
|
||||
- Store project context once in [Memory Bank](/advanced-usage/memory-bank)
|
||||
- Reduces need to re-explain project details
|
||||
- Saves 200-500 tokens per conversation
|
||||
|
||||
**Strategic file mentions:**
|
||||
|
||||
- Only include files directly relevant to the task
|
||||
- Use [`@folder/`](/basic-usage/context-mentions) for broad context, specific files for targeted work
|
||||
|
||||
### Model Switching Strategies
|
||||
|
||||
**Start cheap, escalate when needed:**
|
||||
|
||||
1. **Begin with free models** (Qwen3 Coder, GLM-4.5-Air)
|
||||
2. **Switch to budget models** if free models struggle
|
||||
3. **Escalate to premium models** only for complex tasks
|
||||
|
||||
**Use API Configuration Profiles:**
|
||||
|
||||
- Set up [multiple profiles](/features/api-configuration-profiles) for different cost tiers
|
||||
- Quick switching between free, budget, and premium models
|
||||
- Match model capability to task complexity
|
||||
|
||||
### Mode-Based Cost Optimization
|
||||
|
||||
**Use appropriate modes to limit expensive operations:**
|
||||
|
||||
- **[Ask Mode](/basic-usage/using-modes#ask-mode):** Information gathering without code changes
|
||||
- **[Architect Mode](/basic-usage/using-modes#architect-mode):** Planning without expensive file operations
|
||||
- **[Debug Mode](/basic-usage/using-modes#debug-mode):** Focused troubleshooting
|
||||
|
||||
**Custom modes for budget control:**
|
||||
|
||||
- Create modes that restrict expensive tools
|
||||
- Limit file access to specific directories
|
||||
- Control which operations are auto-approved
|
||||
|
||||
## Real-World Performance Comparisons
|
||||
|
||||
### Code Generation Tasks
|
||||
|
||||
**Simple function creation:**
|
||||
|
||||
- **Mistral Devstral Small:** 95% success rate
|
||||
- **GPT-4:** 98% success rate
|
||||
- **Cost difference:** Free vs $0.20 vs $30 per million tokens
|
||||
|
||||
**Complex refactoring:**
|
||||
|
||||
- **Budget models:** 70-80% success rate
|
||||
- **Premium models:** 90-95% success rate
|
||||
- **Recommendation:** Start with budget, escalate if needed
|
||||
|
||||
### Debugging Performance
|
||||
|
||||
**Simple bugs:**
|
||||
|
||||
- **Free models:** Usually sufficient
|
||||
- **Budget models:** Excellent performance
|
||||
- **Premium models:** Overkill for most cases
|
||||
|
||||
**Complex system issues:**
|
||||
|
||||
- **Free models:** 40-60% success rate
|
||||
- **Budget models:** 60-80% success rate
|
||||
- **Premium models:** 85-95% success rate
|
||||
|
||||
## Hybrid Approach Recommendations
|
||||
|
||||
### Daily Development Workflow
|
||||
|
||||
**Morning planning session:**
|
||||
|
||||
- Use **Architect mode** with **DeepSeek R1**
|
||||
- Plan features and architecture
|
||||
- Create task breakdowns
|
||||
|
||||
**Implementation phase:**
|
||||
|
||||
- Use **Code mode** with **budget models**
|
||||
- Generate and modify code
|
||||
- Handle routine development tasks
|
||||
|
||||
**Complex problem solving:**
|
||||
|
||||
- Switch to **premium models** when stuck
|
||||
- Use for critical debugging
|
||||
- Architecture decisions affecting multiple systems
|
||||
|
||||
### Project Phase Strategy
|
||||
|
||||
**Early development:**
|
||||
|
||||
- Free and budget models for prototyping
|
||||
- Rapid iteration without cost concerns
|
||||
- Establish patterns and structure
|
||||
|
||||
**Production preparation:**
|
||||
|
||||
- Premium models for critical code review
|
||||
- Performance optimization
|
||||
- Security considerations
|
||||
|
||||
## Cost Monitoring and Control
|
||||
|
||||
### Track Your Usage
|
||||
|
||||
**Monitor token consumption:**
|
||||
|
||||
- Check cost estimates in chat history
|
||||
- Review monthly usage patterns
|
||||
- Identify high-cost operations
|
||||
|
||||
**Set spending limits:**
|
||||
|
||||
- Use provider billing alerts
|
||||
- Configure [rate limits](/advanced-usage/rate-limits-costs) to control usage
|
||||
- Set daily/monthly budgets
|
||||
|
||||
### Cost-Saving Tips
|
||||
|
||||
**Reduce system prompt size:**
|
||||
|
||||
- [Disable MCP](/features/mcp/using-mcp-in-kilo-code) if not using external tools
|
||||
- Use focused custom modes
|
||||
- Minimize unnecessary context
|
||||
|
||||
**Optimize conversation length:**
|
||||
|
||||
- Use [Checkpoints](/features/checkpoints) to reset context
|
||||
- Start fresh conversations for unrelated tasks
|
||||
- Archive completed work
|
||||
|
||||
**Batch similar tasks:**
|
||||
|
||||
- Group related code changes
|
||||
- Handle multiple files in single requests
|
||||
- Reduce conversation overhead
|
||||
|
||||
## Getting Started with Budget Models
|
||||
|
||||
### Quick Setup Guide
|
||||
|
||||
1. **Create OpenRouter account** for free models
|
||||
2. **Configure multiple providers** in Kilo Code
|
||||
3. **Set up API Configuration Profiles** for easy switching
|
||||
4. **Escalate to budget models** when needed
|
||||
5. **Reserve premium models** for complex work
|
||||
|
||||
### Recommended Provider Mix
|
||||
|
||||
**Free tier foundation:**
|
||||
|
||||
- [OpenRouter](/providers/openrouter) - Free models
|
||||
- [Groq](/providers/groq) - Fast inference for supported models
|
||||
- [Z.ai](https://z.ai/model-api) - Provides a free model GLM-4.5-Flash
|
||||
|
||||
**Budget tier options:**
|
||||
|
||||
- [DeepSeek](/providers/deepseek) - Excellent value models
|
||||
- [Mistral](/providers/mistral) - Specialized coding models
|
||||
|
||||
**Premium tier backup:**
|
||||
|
||||
- [Anthropic](/providers/anthropic) - Claude for complex reasoning
|
||||
- [OpenAI](/providers/openai) - GPT-4 for critical tasks
|
||||
|
||||
## Measuring Success
|
||||
|
||||
**Track these metrics:**
|
||||
|
||||
- Monthly AI costs vs. development productivity
|
||||
- Task completion rates by model tier
|
||||
- Time saved vs. money spent
|
||||
- Code quality improvements
|
||||
|
||||
**Success indicators:**
|
||||
|
||||
- 70%+ of tasks completed with free/budget models
|
||||
- Monthly costs under your target budget
|
||||
- Maintained or improved code quality
|
||||
- Faster development cycles
|
||||
|
||||
By combining free models, strategic budget model usage, and smart optimization techniques, you can harness the full power of AI-assisted development while keeping costs minimal. Start with free options and gradually incorporate budget models as your needs and comfort with costs grow.
|
||||
@@ -1,38 +0,0 @@
|
||||
# Using Local Models
|
||||
|
||||
Kilo Code supports running language models locally on your own machine using [Ollama](https://ollama.com/) and [LM Studio](https://lmstudio.ai/). This offers several advantages:
|
||||
|
||||
* **Privacy:** Your code and data never leave your computer.
|
||||
* **Offline Access:** You can use Kilo Code even without an internet connection.
|
||||
* **Cost Savings:** Avoid API usage fees associated with cloud-based models.
|
||||
* **Customization:** Experiment with different models and configurations.
|
||||
|
||||
**However, using local models also has some drawbacks:**
|
||||
|
||||
* **Resource Requirements:** Local models can be resource-intensive, requiring a powerful computer with a good CPU and, ideally, a dedicated GPU.
|
||||
* **Setup Complexity:** Setting up local models can be more complex than using cloud-based APIs.
|
||||
* **Model Performance:** The performance of local models can vary significantly. While some are excellent, they may not always match the capabilities of the largest, most advanced cloud models.
|
||||
* **Limited Features**: Local models (and many online models) often do not support advanced features such as prompt caching, computer use, and others.
|
||||
|
||||
## Supported Local Model Providers
|
||||
|
||||
Kilo Code currently supports two main local model providers:
|
||||
|
||||
1. **Ollama:** A popular open-source tool for running large language models locally. It supports a wide range of models.
|
||||
2. **LM Studio:** A user-friendly desktop application that simplifies the process of downloading, configuring, and running local models. It also provides a local server that emulates the OpenAI API.
|
||||
|
||||
## Setting Up Local Models
|
||||
|
||||
For detailed setup instructions, see:
|
||||
* [Setting up Ollama](/providers/ollama)
|
||||
* [Setting up LM Studio](/providers/lmstudio)
|
||||
|
||||
Both providers offer similar capabilities but with different user interfaces and workflows. Ollama provides more control through its command-line interface, while LM Studio offers a more user-friendly graphical interface.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
* **"No connection could be made because the target machine actively refused it":** This usually means that the Ollama or LM Studio server isn't running, or is running on a different port/address than Kilo Code is configured to use. Double-check the Base URL setting.
|
||||
|
||||
* **Slow Response Times:** Local models can be slower than cloud-based models, especially on less powerful hardware. If performance is an issue, try using a smaller model.
|
||||
|
||||
* **Model Not Found:** Ensure you have typed in the name of the model correctly. If you're using Ollama, use the same name that you provide in the `ollama run` command.
|
||||
@@ -1,301 +0,0 @@
|
||||
# Memory Bank
|
||||
|
||||
## Overview
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://youtu.be/FwAYGslfB6Y"
|
||||
/>
|
||||
|
||||
<figure style={{ float: 'right', width: '40%', maxWidth: '350px', margin: '0 0 10px 20px' }}>
|
||||
<img src="/docs/img/memory-bank/at-work.png" alt="Executing task with the memory bank" style={{ border: '1px solid grey', borderRadius: '5px', width: '100%' }} />
|
||||
<figcaption style={{ fontSize: '0.9rem', color: '#666', marginTop: '8px', textAlign: 'center' }}>
|
||||
Kilo Code works more efficiently with Memory Bank enabled, instantly understanding project context and technologies.
|
||||
</figcaption>
|
||||
</figure>
|
||||
|
||||
### The Problem: AI Memory Loss
|
||||
|
||||
AI assistants like Kilo Code face a fundamental limitation: they reset completely between sessions. This "memory loss" means that every time you start a new conversation, you need to re-explain your project's architecture, goals, technologies, and current status. This creates a critical efficiency dilemma: AI models either make edits without proper project understanding (leading to errors and misaligned solutions), or must spend significant time and resources analyzing your entire codebase in each session (which is prohibitively expensive and slow for larger projects)
|
||||
|
||||
Without a solution to this memory problem, AI assistants remain powerful but stateless tools that can't truly function as persistent development partners.
|
||||
|
||||
### The Solution: Memory Bank
|
||||
|
||||
Memory Bank is a system of structured documentation that enables Kilo Code to **better understand your project** and **maintain context across coding sessions**. It transforms your AI assistant from a stateless tool into a persistent development partner with perfect recall of your project details. Kilo Code automatically reads your Memory Bank files to rebuild its understanding of your project whenever you start a new session.
|
||||
|
||||
When Memory Bank is active, Kilo Code begins each task with `[Memory Bank: Active]` and a brief summary of your project context, ensuring consistent understanding without repetitive explanations.
|
||||
|
||||
## Key Benefits
|
||||
|
||||
- **Language Agnostic**: Functions with any programming language or framework
|
||||
- **Efficient Project Understanding**: Helps Kilo Code understand the purpose and tech stack of a project
|
||||
- **Context Preservation**: Maintain project knowledge across sessions without needing to scan files in every new session
|
||||
- **Faster Startup**: Kilo Code immediately comprehends your project context when you begin a new session
|
||||
- **Self-Documenting Projects**: Create valuable documentation as a byproduct
|
||||
|
||||
## How Memory Bank Works
|
||||
|
||||
Memory Bank is built on Kilo Code's [Custom Rules](/advanced-usage/custom-rules) feature, providing a specialized framework for project documentation. Memory Bank files are standard markdown files stored in `.kilocode/rules/memory-bank` folder within your project repository. They're not hidden or proprietary - they're regular documentation files that both you and Kilo Code can access.
|
||||
|
||||
At the start of every task, Kilo Code reads all Memory Bank files to build a comprehensive understanding of your project. This happens automatically without requiring any action from you. Kilo Code then indicates successful Memory Bank activation with `[Memory Bank: Active]` at the beginning of its response, followed by a brief summary of its understanding of your project.
|
||||
|
||||
Files are organized in a hierarchical structure that builds a complete picture of your project:
|
||||
|
||||
## Core Memory Bank Files
|
||||
|
||||
### brief.md
|
||||
*This file is created and maintained manually by you*
|
||||
- The foundation of your project
|
||||
- High-level overview of what you're building
|
||||
- Core requirements and goals
|
||||
|
||||
Example: *"Building a React web app for inventory management with barcode scanning. The system needs to support multiple warehouses and integrate with our existing ERP system."*
|
||||
|
||||
Note: Kilo Code will not edit this file directly but may suggest improvements if it identifies ways to enhance your project brief.
|
||||
|
||||
### product.md
|
||||
- Explains why the project exists
|
||||
- Describes the problems being solved
|
||||
- Outlines how the product should work
|
||||
- User experience goals
|
||||
|
||||
Example: *"The inventory system needs to support multiple warehouses and real-time updates. It solves the problem of inventory discrepancies by providing barcode scanning for accurate stock counts."*
|
||||
|
||||
### context.md
|
||||
- The most frequently updated file
|
||||
- Contains current work focus and recent changes
|
||||
- Tracks active decisions and considerations
|
||||
- Next steps for development
|
||||
|
||||
Example: *"Currently implementing the barcode scanner component; last session completed the API integration. Next steps include adding error handling for network failures."*
|
||||
|
||||
### architecture.md
|
||||
- Documents the system architecture
|
||||
- Records key technical decisions
|
||||
- Lists design patterns in use
|
||||
- Explains component relationships
|
||||
- Critical implementation paths
|
||||
|
||||
Example: *"Using Redux for state management with a normalized store structure. The application follows a modular architecture with separate services for API communication, state management, and UI components."*
|
||||
|
||||
### tech.md
|
||||
- Lists technologies and frameworks used
|
||||
- Describes development setup
|
||||
- Notes technical constraints
|
||||
- Records dependencies and tool configurations
|
||||
- Tool usage patterns
|
||||
|
||||
Example: *"React 18, TypeScript, Firebase, Jest for testing. Development requires Node.js 16+ and uses Vite as the build tool."*
|
||||
|
||||
## Additional Context Files
|
||||
|
||||
Create additional files as needed to organize:
|
||||
- Complex feature documentation
|
||||
- Integration specifications
|
||||
- API documentation
|
||||
- Testing strategies
|
||||
- Deployment procedures
|
||||
|
||||
These additional files help organize more detailed information that doesn't fit neatly into the core files.
|
||||
|
||||
### tasks.md
|
||||
*Optional file for documenting repetitive tasks*
|
||||
- Stores workflows for tasks that follow similar patterns
|
||||
- Documents which files need to be modified
|
||||
- Captures step-by-step procedures
|
||||
- Records important considerations and gotchas
|
||||
|
||||
Example: Adding support for new AI models, implementing API endpoints, or any task that requires doing similar jobs repeatedly.
|
||||
|
||||
## Getting Started with Memory Bank
|
||||
|
||||
### First-Time Setup
|
||||
|
||||
1. Create a `.kilocode/rules/memory-bank/` folder in your project
|
||||
2. Write a basic project brief in `.kilocode/rules/memory-bank/brief.md`
|
||||
3. Create a file `.kilocode/rules/memory-bank-instructions.md` and paste there [this document](pathname:///downloads/memory-bank.md)
|
||||
4. Switch to `Architect` mode
|
||||
5. Check if a best available AI model is selected, don't use "lightweight" models
|
||||
6. Ask Kilo Code to "initialize memory bank"
|
||||
7. Wait for Kilo Code to analyze your project and initialize the Memory Bank files
|
||||
8. Verify the content of the files to see if the project is described correctly. Update the files if necessary.
|
||||
|
||||
### Project Brief Tips
|
||||
|
||||
- Start simple - it can be as detailed or high-level as you like
|
||||
- Focus on what matters most to you
|
||||
- Kilo Code will help fill in gaps and ask questions
|
||||
- You can update it as your project evolves
|
||||
|
||||
Sample prompt that delivers a reasonably good brief:
|
||||
|
||||
```
|
||||
Provide a concise and comprehensive description of this project, highlighting its main objectives, key features, used technologies and significance. Then, write this description into a text file named appropriately to reflect the project's content, ensuring clarity and professionalism in the writing. Stay brief and short.
|
||||
```
|
||||
|
||||
## Working with Memory Bank
|
||||
|
||||
### Core Workflows
|
||||
|
||||
#### Memory Bank Initialization
|
||||
|
||||
The initialization step is critically important as it establishes the foundation for all future interactions with your project. When you request initialization with the command `initialize memory bank`, Kilo Code will:
|
||||
|
||||
1. Perform an exhaustive analysis of your project, including:
|
||||
- All source code files and their relationships
|
||||
- Configuration files and build system setup
|
||||
- Project structure and organization patterns
|
||||
- Documentation and comments
|
||||
- Dependencies and external integrations
|
||||
- Testing frameworks and patterns
|
||||
2. Create comprehensive memory bank files in the `.kilocode/rules/memory-bank` folder
|
||||
3. Provide a detailed summary of what it has understood about your project
|
||||
4. Ask you to verify the accuracy of the generated files
|
||||
|
||||
:::warning Important
|
||||
Take time to carefully review and correct the generated files after initialization. Any misunderstandings or missing information at this stage will affect all future interactions. A thorough initialization dramatically improves Kilo Code's effectiveness, while a rushed or incomplete initialization will permanently limit its ability to assist you effectively.
|
||||
:::
|
||||
|
||||
#### Memory Bank Updates
|
||||
|
||||
Memory Bank updates occur when:
|
||||
1. Kilo Code discovers new project patterns
|
||||
2. After implementing significant changes
|
||||
3. When you explicitly request with `update memory bank`
|
||||
4. When context needs clarification
|
||||
|
||||
To execute a Memory Bank update, Kilo Code will:
|
||||
1. Review ALL project files
|
||||
2. Document the current state
|
||||
3. Document insights and patterns
|
||||
4. Update all memory bank files as needed
|
||||
|
||||
You can direct Kilo Code to focus on specific information sources by using commands like `update memory bank using information from @/Makefile`.
|
||||
|
||||
#### Regular Task Execution
|
||||
|
||||
At the beginning of every task, Kilo Code:
|
||||
1. Reads ALL memory bank files
|
||||
2. Includes `[Memory Bank: Active]` at the beginning of its response
|
||||
3. Provides a brief summary of its understanding of your project
|
||||
4. Proceeds with the requested task
|
||||
|
||||
At the end of a task, Kilo Code may suggest updating the memory bank if significant changes were made, using the phrase: "Would you like me to update memory bank to reflect these changes?"
|
||||
|
||||
#### Add Task Workflow
|
||||
|
||||
When you complete a repetitive task that follows a similar pattern each time, you can document it for future reference. This is particularly useful for tasks like adding features that follow existing patterns
|
||||
|
||||
To document a task, use the command `add task` or `store this as a task`. Kilo Code will:
|
||||
1. Create or update the `tasks.md` file in the memory bank folder
|
||||
2. Document the task using current context:
|
||||
- Task name and description
|
||||
- List of files that need to be modified
|
||||
- Step-by-step workflow
|
||||
- Important considerations
|
||||
- Example implementation
|
||||
|
||||
When starting a new task, Kilo Code will check if it matches any documented tasks and follow the established workflow to ensure no steps are missed.
|
||||
|
||||
### Key Commands
|
||||
|
||||
- `initialize memory bank` - Use when starting a new project
|
||||
- `update memory bank` - Initiates a comprehensive re-analysis of the contextual documentation for the current task. **Caution:** This is resource-intensive and not recommended for "lightweight" models due to potentially reduced effectiveness. Can be used multiple times, well combinable with specific instructions, e.g. `update memory bank using information from @/Makefile`
|
||||
- `add task` or `store this as a task` - Documents a repetitive task for future reference
|
||||
|
||||
### Status Indicators
|
||||
|
||||
Kilo Code uses status indicators to clearly communicate Memory Bank status:
|
||||
|
||||
- `[Memory Bank: Active]` - Indicates Memory Bank files were successfully read and are being used
|
||||
- `[Memory Bank: Missing]` - Indicates Memory Bank files could not be found or are empty
|
||||
|
||||
These indicators appear at the beginning of Kilo Code's responses, providing immediate confirmation of Memory Bank status.
|
||||
|
||||
### Documentation Updates
|
||||
|
||||
Memory Bank updates should automatically occur when:
|
||||
- You discover new patterns in your project
|
||||
- After implementing significant changes
|
||||
- When you explicitly request with `update memory bank`
|
||||
- When you feel context needs clarification
|
||||
|
||||
## Context Window Management
|
||||
|
||||
As you work with Kilo Code, your context window will eventually fill up. When you notice responses slowing down or references becoming less accurate:
|
||||
|
||||
1. Ask Kilo Code to "update memory bank" to document the current state
|
||||
2. Start a new conversation/task
|
||||
3. Kilo Code will automatically access your Memory Bank in the new conversation
|
||||
|
||||
This process ensures continuity across multiple sessions without losing important context.
|
||||
|
||||
## Handling Inconsistencies
|
||||
|
||||
If Kilo Code detects inconsistencies between memory bank files:
|
||||
|
||||
1. It will prioritize information from `brief.md` as the source of truth
|
||||
2. Note any discrepancies to you
|
||||
3. Continue working with the most reliable information available
|
||||
|
||||
This ensures that even with imperfect documentation, Kilo Code can still function effectively.
|
||||
|
||||
## Frequently Asked Questions
|
||||
|
||||
### Where are the memory bank files stored?
|
||||
The Memory Bank files are regular markdown files stored in your project repository, typically in a `.kilocode/rules/memory-bank/` folder. They're not hidden system files - they're designed to be part of your project documentation.
|
||||
|
||||
### How often should I update the memory bank?
|
||||
Update the Memory Bank after significant milestones or changes in direction. For active development, updates every few sessions can be helpful. Use the "update memory bank" command when you want to ensure all context is preserved.
|
||||
|
||||
### Can I edit memory bank files manually?
|
||||
Yes! While Kilo Code manages most of the files, you can edit any of them manually. The `brief.md` file is specifically designed to be maintained by you. Manual edits to other files will be respected by Kilo Code.
|
||||
|
||||
### What happens if memory bank files are missing?
|
||||
If memory bank files are missing, Kilo Code will indicate this with `[Memory Bank: Missing]` at the beginning of its response and suggest initializing the memory bank.
|
||||
|
||||
### Does Memory Bank work with all AI models?
|
||||
Memory Bank works with all AI models, but more powerful models will create more comprehensive and accurate memory bank files. Lightweight models may struggle with the resource-intensive process of analyzing and updating memory bank files.
|
||||
|
||||
### Can I use Memory Bank with multiple projects?
|
||||
Yes! Each project has its own Memory Bank in its `.kilocode/rules/memory-bank/` folder. Kilo Code will automatically use the correct Memory Bank for each project.
|
||||
|
||||
### Doesn't Memory Bank use up my context window?
|
||||
Yes, Memory Bank does consume some of your context window at the beginning of each session as it loads all memory bank files. However, this is a strategic tradeoff that significantly improves overall efficiency. By front-loading project context:
|
||||
|
||||
- You eliminate repetitive explanations that would consume even more context over time
|
||||
- You reach productive outcomes with fewer back-and-forth exchanges
|
||||
- You maintain consistent understanding throughout your session
|
||||
|
||||
Testing shows that while Memory Bank uses more tokens initially, it dramatically reduces the total number of interactions needed to achieve results. This means less time explaining and more time building.
|
||||
|
||||
## Best Practices
|
||||
|
||||
### Getting Started
|
||||
- Start with a basic project brief and let the structure evolve
|
||||
- Let Kilo Code help create the initial structure
|
||||
- Review and adjust files as needed to match your workflow
|
||||
- Verify the accuracy of generated files after initialization
|
||||
|
||||
### Ongoing Work
|
||||
- Let patterns emerge naturally as you work
|
||||
- Don't force documentation updates - they should happen organically
|
||||
- Trust the process - the value compounds over time
|
||||
- Watch for context confirmation at the start of sessions
|
||||
- Use the status indicators to confirm Memory Bank is active
|
||||
|
||||
### Documentation Flow
|
||||
- `brief.md` is your foundation
|
||||
- `context.md` changes most frequently
|
||||
- All files collectively maintain project intelligence
|
||||
- Update after significant milestones or changes in direction
|
||||
|
||||
### Optimizing Memory Bank Performance
|
||||
- Keep memory bank files concise and focused
|
||||
- Use additional files for detailed documentation
|
||||
- Update regularly but not excessively
|
||||
- Use specific update commands when focusing on particular aspects
|
||||
|
||||
## Remember
|
||||
|
||||
The Memory Bank is Kilo Code's only link to previous work. Its effectiveness depends entirely on maintaining clear, accurate documentation and confirming context preservation in every interaction. When you see `[Memory Bank: Active]` at the beginning of a response, you can be confident that Kilo Code has a comprehensive understanding of your project.
|
||||
@@ -1,91 +0,0 @@
|
||||
# Prompt Engineering Tips
|
||||
|
||||
Prompt engineering is the art of crafting effective instructions for AI models like Kilo Code. Well-written prompts lead to better results, fewer errors, and a more efficient workflow.
|
||||
|
||||
## General Principles
|
||||
|
||||
* **Be Clear and Specific:** Clearly state what you want Kilo Code to do. Avoid ambiguity.
|
||||
* **Bad:** Fix the code.
|
||||
* **Good:** Fix the bug in the `calculateTotal` function that causes it to return incorrect results.
|
||||
|
||||
* **Provide Context:** Use [Context Mentions](/basic-usage/context-mentions) to refer to specific files, folders, or problems.
|
||||
* **Good:** `@/src/utils.ts` Refactor the `calculateTotal` function to use async/await.
|
||||
|
||||
* **Break Down Tasks:** Divide complex tasks into smaller, well-defined steps.
|
||||
|
||||
* **Give Examples:** If you have a specific coding style or pattern in mind, provide examples.
|
||||
|
||||
* **Specify Output Format:** If you need the output in a particular format (e.g., JSON, Markdown), specify it in the prompt.
|
||||
|
||||
* **Iterate:** Don't be afraid to refine your prompt if the initial results aren't what you expect.
|
||||
|
||||
## Thinking vs. Doing
|
||||
|
||||
It's often helpful to guide Kilo Code through a "think-then-do" process:
|
||||
|
||||
1. **Analyze:** Ask Kilo Code to analyze the current code, identify problems, or plan the approach.
|
||||
2. **Plan:** Have Kilo Code outline the steps it will take to complete the task.
|
||||
3. **Execute:** Instruct Kilo Code to implement the plan, one step at a time.
|
||||
4. **Review:** Carefully review the results of each step before proceeding.
|
||||
|
||||
## Using Custom Instructions
|
||||
|
||||
You can provide custom instructions to further tailor Kilo Code's behavior. There are two types of custom instructions:
|
||||
|
||||
* **Global Custom Instructions:** Apply to all modes.
|
||||
* **Mode-Specific Custom Instructions:** Apply only to a specific mode (e.g., Code, Architect, Ask, Debug, or a custom mode).
|
||||
|
||||
Custom instructions are added to the system prompt, providing persistent guidance to the AI model. You can use these to:
|
||||
|
||||
* Enforce coding style guidelines.
|
||||
* Specify preferred libraries or frameworks.
|
||||
* Define project-specific conventions.
|
||||
* Adjust Kilo Code's tone or personality.
|
||||
|
||||
See the [Custom Instructions](/advanced-usage/custom-instructions) section for more details.
|
||||
|
||||
## Handling Ambiguity
|
||||
|
||||
If your request is ambiguous or lacks sufficient detail, Kilo Code might:
|
||||
|
||||
* **Make Assumptions:** It might proceed based on its best guess, which may not be what you intended.
|
||||
* **Ask Follow-Up Questions:** It might use the `ask_followup_question` tool to clarify your request.
|
||||
|
||||
It's generally better to provide clear and specific instructions from the start to avoid unnecessary back-and-forth.
|
||||
|
||||
## Providing Feedback
|
||||
|
||||
If Kilo Code doesn't produce the desired results, you can provide feedback by:
|
||||
|
||||
* **Rejecting Actions:** Click the "Reject" button when Kilo Code proposes an action you don't want.
|
||||
* **Providing Explanations:** When rejecting, explain *why* you're rejecting the action. This helps Kilo Code learn from its mistakes.
|
||||
* **Rewording Your Request:** Try rephrasing your initial task or providing more specific instructions.
|
||||
* **Manually Correcting:** If there are a few small issues, you can also directly modify the code before accepting the changes.
|
||||
|
||||
## Examples
|
||||
|
||||
**Good Prompt:**
|
||||
|
||||
> `@/src/components/Button.tsx` Refactor the `Button` component to use the `useState` hook instead of the `useReducer` hook.
|
||||
|
||||
**Bad Prompt:**
|
||||
|
||||
> Fix the button.
|
||||
|
||||
**Good Prompt:**
|
||||
|
||||
> Create a new file named `utils.py` and add a function called `calculate_average` that takes a list of numbers and returns their average.
|
||||
|
||||
**Bad Prompt:**
|
||||
|
||||
> Write some Python code.
|
||||
|
||||
**Good Prompt:**
|
||||
|
||||
> `@problems` Address all errors and warnings in the current file.
|
||||
|
||||
**Bad Prompt:**
|
||||
|
||||
> Fix everything.
|
||||
|
||||
By following these tips, you can write effective prompts that get the most out of Kilo Code's capabilities.
|
||||
@@ -1,51 +0,0 @@
|
||||
# Rate Limits and Costs
|
||||
|
||||
Understanding and managing API usage is crucial for a smooth and cost-effective experience with Kilo Code. This section explains how to track your token usage, costs, and how to configure rate limits.
|
||||
|
||||
## Token Usage
|
||||
|
||||
Kilo Code interacts with AI models using tokens. Tokens are essentially pieces of words. The number of tokens used in a request and response affects both the processing time and the cost.
|
||||
|
||||
* **Input Tokens:** These are the tokens in your prompt, including the system prompt, your instructions, and any context provided (e.g., file contents).
|
||||
* **Output Tokens:** These are the tokens generated by the AI model in its response.
|
||||
|
||||
You can see the number of input and output tokens used for each interaction in the chat history.
|
||||
|
||||
## Cost Calculation
|
||||
|
||||
Most AI providers charge based on the number of tokens used. Pricing varies depending on the provider and the specific model.
|
||||
|
||||
Kilo Code automatically calculates the estimated cost of each API request based on the configured model's pricing. This cost is displayed in the chat history, next to the token usage.
|
||||
|
||||
**Note:**
|
||||
|
||||
* The cost calculation is an *estimate*. The actual cost may vary slightly depending on the provider's billing practices.
|
||||
* Some providers may offer free tiers or credits. Check your provider's documentation for details.
|
||||
* Some providers offer prompt caching which greatly lowers cost.
|
||||
|
||||
## Configuring Rate Limits
|
||||
|
||||
To prevent accidental overuse of the API and to help you manage costs, Kilo Code allows you to set a rate limit. The rate limit specifies the minimum time (in seconds) between API requests.
|
||||
|
||||
**How to configure:**
|
||||
|
||||
1. Open the Kilo Code settings (<Codicon name="gear" /> icon in the top right corner).
|
||||
2. Go to the "Advanced Settings" section.
|
||||
3. Find the "Rate Limit (seconds)" setting.
|
||||
4. Enter the desired delay in seconds. A value of 0 disables rate limiting.
|
||||
|
||||
**Example:**
|
||||
|
||||
If you set the rate limit to 10 seconds, Kilo Code will wait at least 10 seconds after one API request completes before sending the next one.
|
||||
|
||||
## Tips for Optimizing Token Usage
|
||||
|
||||
* **Be Concise:** Use clear and concise language in your prompts. Avoid unnecessary words or details.
|
||||
* **Provide Only Relevant Context:** Use context mentions (`@file.ts`, `@folder/`) selectively. Only include the files that are directly relevant to the task.
|
||||
* **Break Down Tasks:** Divide large tasks into smaller, more focused sub-tasks.
|
||||
* **Use Custom Instructions:** Provide custom instructions to guide Kilo Code's behavior and reduce the need for lengthy explanations in each prompt.
|
||||
* **Choose the Right Model:** Some models are more cost-effective than others. Consider using a smaller, faster model for tasks that don't require the full power of a larger model.
|
||||
* **Use Modes:** Different modes can access different tools, for example `Architect` can't modify code, which makes it a safe choice when analyzing a complex codebase, without worrying about accidentally allowing expensive operations.
|
||||
* **Disable MCP If Not Used:** If you're not using MCP (Model Context Protocol) features, consider [disabling it in the MCP settings](/features/mcp/using-mcp-in-kilo-code) to significantly reduce the size of the system prompt and save tokens.
|
||||
|
||||
By understanding and managing your API usage, you can use Kilo Code effectively and efficiently.
|
||||
@@ -1,28 +0,0 @@
|
||||
import { DISCORD_URL } from '@site/src/constants.ts'
|
||||
|
||||
# Adding More Tokens
|
||||
|
||||
Once you've used any initial free tokens, you can easily add more:
|
||||
|
||||
- Add a credit card to your account (all payments are securely processed through Stripe)
|
||||
- We don't currently offer a subscription, so you only pay for the tokens you use, and only when you choose to top up your tokens!
|
||||
- Leverage your own API provider by [connecting your own API provider](/getting-started/connecting-api-provider.md)
|
||||
|
||||
## Transparent Pricing
|
||||
|
||||
At Kilo Code, we believe in complete pricing transparency:
|
||||
|
||||
- Our pricing matches the model provider's API rates exactly
|
||||
- We don't take any commission or markup, either per token or per top-up
|
||||
- You only pay for what you use with no hidden fees
|
||||
|
||||
## Future Plans
|
||||
|
||||
We're continuously working to improve Kilo Code and expand our offerings:
|
||||
|
||||
- Additional LLM providers will be added in the future
|
||||
- More payment options and other plans are under development
|
||||
|
||||
:::tip Need Help?
|
||||
If you have any questions about pricing or tokens, please reach out to our [support team](mailto:hi@kilocode.ai) or ask in our <a href={DISCORD_URL} target='_blank'>Discord community</a>.
|
||||
:::
|
||||
@@ -1,94 +0,0 @@
|
||||
---
|
||||
title: Autocomplete
|
||||
sidebar_position: 4
|
||||
---
|
||||
|
||||
# Autocomplete
|
||||
|
||||
Kilo Code's autocomplete feature provides intelligent code suggestions and completions while you're typing, helping you write code faster and more efficiently. It offers both automatic and manual triggering options.
|
||||
|
||||
## How Autocomplete Works
|
||||
|
||||
Autocomplete analyzes your code context and provides:
|
||||
|
||||
- **Inline completions** as you type
|
||||
- **Quick fixes** for common code patterns
|
||||
- **Contextual suggestions** based on your surrounding code
|
||||
- **Multi-line completions** for complex code structures
|
||||
|
||||
The feature uses your selected AI provider to generate intelligent suggestions that match your coding style and project context.
|
||||
|
||||
## Triggering Options
|
||||
|
||||
### Pause to Complete
|
||||
|
||||
When enabled, Kilo Code automatically triggers autocomplete when you pause typing. This provides a seamless coding experience where suggestions appear naturally as you work.
|
||||
|
||||
- **Auto Trigger Delay**: Configure the delay (in seconds) before autocomplete triggers after you stop typing
|
||||
- Default is 3 seconds, but this can be adjusted up or down
|
||||
- Shorter delays mean quicker suggestions but may be more resource-intensive
|
||||
|
||||
### Quick Task (Cmd+I)
|
||||
|
||||
Need to make a quick change? The Quick Task feature allows you to:
|
||||
|
||||
1. Select code in your editor (or place your cursor where you want changes)
|
||||
2. Press `Cmd+I` (Mac) or `Ctrl+I` (Windows/Linux)
|
||||
3. Describe your goal in plain English
|
||||
4. Receive a code suggestion without going to the chat
|
||||
|
||||
**Examples:**
|
||||
|
||||
- "create a React component with these props"
|
||||
- "add error handling to this function"
|
||||
- "convert this to TypeScript"
|
||||
- "optimize this loop for performance"
|
||||
|
||||
You can customize the keyboard shortcut in VS Code's keyboard shortcuts settings.
|
||||
|
||||
### Manual Autocomplete (Cmd+L)
|
||||
|
||||
For more control over when suggestions appear:
|
||||
|
||||
1. Position your cursor where you need assistance
|
||||
2. Press `Cmd+L` (Mac) or `Ctrl+L` (Windows/Linux)
|
||||
3. Kilo Code analyzes the surrounding context
|
||||
4. Receive immediate improvements or completions
|
||||
|
||||
This is ideal for:
|
||||
|
||||
- Quick fixes
|
||||
- Code completions
|
||||
- Refactoring suggestions
|
||||
- Keeping you in the flow without interruptions
|
||||
|
||||
You can customize this keyboard shortcut as well in your VS Code settings.
|
||||
|
||||
## Advanced Settings
|
||||
|
||||
### Provider Configuration
|
||||
|
||||
By default, autocomplete uses your main Kilo Code/OpenRouter/Mistral credentials with the Codestral model.
|
||||
This model is recommended as it strikes an optimal balance between performance speed and capability.
|
||||
However, you can:
|
||||
|
||||
- **Use custom provider**: Toggle this option to use a different AI provider specifically for autocomplete
|
||||
- **Select different models**: Choose models optimized for speed vs. quality based on your needs
|
||||
|
||||
## Best Practices
|
||||
|
||||
1. **Balance speed and quality**: Faster models provide quicker suggestions but may be less accurate
|
||||
2. **Adjust trigger delay**: Find the sweet spot between responsiveness and avoiding too many API calls
|
||||
3. **Use Quick Task for complex changes**: It's designed for more substantial code modifications
|
||||
4. **Use Manual Autocomplete for precision**: When you need suggestions at specific moments
|
||||
5. **Configure providers wisely**: Consider using faster, cheaper models for autocomplete while keeping more powerful models for chat
|
||||
|
||||
## Tips
|
||||
|
||||
- Autocomplete works best with clear, well-structured code
|
||||
- Comments above functions help autocomplete understand intent
|
||||
- Variable and function names matter - descriptive names lead to better suggestions
|
||||
|
||||
## Related Features
|
||||
|
||||
- [Code Actions](../features/code-actions) - Context menu options for common coding tasks
|
||||
@@ -1,81 +0,0 @@
|
||||
---
|
||||
sidebar_label: Overview
|
||||
---
|
||||
|
||||
# API Providers Overview
|
||||
|
||||
**Bottom line**: Kilo Code, like any agentic AI coding tool, needs AI model providers to function. You can use our [built-in provider](/providers/kilocode) (easiest) or connect your own API keys from **30+ providers**.
|
||||
|
||||
## Kilo Code Extension vs. API Provider
|
||||
|
||||
### The Extension
|
||||
|
||||
- VS Code tool you install from the marketplace
|
||||
- Handles UI, file operations, and workflow management
|
||||
- [Open source](https://github.com/Kilo-Org/kilocode)
|
||||
- Connects to any AI provider
|
||||
|
||||
### Kilo Code API Provider
|
||||
|
||||
- **Built-in option** that comes with the extension
|
||||
- Google sign-in with free credits included
|
||||
- No API key management required
|
||||
- Access to frontier coding models
|
||||
- [Competitive pricing](https://kilocode.ai/pricing)
|
||||
|
||||
**Key point**: The extension works with any provider—our API service is just the "batteries included" option.
|
||||
|
||||
## Getting Started: Two Paths
|
||||
|
||||
### Option 1: Built-in Provider (Recommended)
|
||||
|
||||
✅ **Fastest setup**
|
||||
|
||||
- Sign in with Google or GitHub at kilocode.ai
|
||||
- Free credits included for your first top-up
|
||||
- Zero API key management
|
||||
- Latest models available
|
||||
|
||||
→ [Complete setup guide](/providers/kilocode)
|
||||
|
||||
### Option 2: Your Own Provider
|
||||
|
||||
**More control, more setup**
|
||||
|
||||
1. Choose from 30+ supported providers
|
||||
2. Get API key from your provider
|
||||
3. Configure in Kilo Code settings
|
||||
|
||||
## Why Use Multiple Providers?
|
||||
|
||||
- **Cost**: Compare pricing across providers
|
||||
- **Models**: Access different AI capabilities
|
||||
- **Reliability**: Backup options for outages
|
||||
- **Features**: Some providers offer exclusive models
|
||||
- **Regional**: Better performance in certain locations
|
||||
|
||||
## What's in This Section
|
||||
|
||||
### [Connecting Your First AI Provider](/getting-started/connecting-api-provider)
|
||||
|
||||
**For beginners**: Step-by-step setup including:
|
||||
|
||||
- Recommended providers
|
||||
- How to get API keys
|
||||
- Initial VS Code configuration
|
||||
- Starting your first AI chat
|
||||
|
||||
### [API Configuration Profiles](/features/api-configuration-profiles)
|
||||
|
||||
**For power users**: Advanced management including:
|
||||
|
||||
- Multiple provider configurations
|
||||
- Model switching strategies
|
||||
- Secure API key management
|
||||
- Task-specific optimizations
|
||||
|
||||
## Security Note
|
||||
|
||||
All API keys use VS Code's Secret Storage—never stored in plain text. Industry-standard security practices protect your credentials.
|
||||
|
||||
**Ready to start?** → [Connect your first provider](/getting-started/connecting-api-provider) or jump to [advanced profiles](/features/api-configuration-profiles).
|
||||
@@ -1,122 +0,0 @@
|
||||
# Context Mentions
|
||||
|
||||
Context mentions are a powerful way to provide Kilo Code with specific information about your project, allowing it to perform tasks more accurately and efficiently. You can use mentions to refer to files, folders, problems, and Git commits. Context mentions start with the `@` symbol.
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions.png" alt="Context Mentions Overview - showing the @ symbol dropdown menu in the chat interface" width="600" />
|
||||
|
||||
*Context mentions overview showing the @ symbol dropdown menu in the chat interface.*
|
||||
|
||||
## Types of Mentions
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions-1.png" alt="File mention example showing a file being referenced with @ and its contents appearing in the conversation" width="600" />
|
||||
|
||||
*File mentions add actual code content into the conversation for direct reference and analysis.*
|
||||
|
||||
| Mention Type | Format | Description | Example Usage |
|
||||
|--------------|--------|-------------|--------------|
|
||||
| **File** | `@/path/to/file.ts` | Includes file contents in request context | "Explain the function in @/src/utils.ts" |
|
||||
| **Folder** | `@/path/to/folder/` | Provides directory structure in tree format | "What files are in @/src/components/?" |
|
||||
| **Problems** | `@problems` | Includes VS Code Problems panel diagnostics | "@problems Fix all errors in my code" |
|
||||
| **Terminal** | `@terminal` | Includes recent terminal command and output | "Fix the errors shown in @terminal" |
|
||||
| **Git Commit** | `@a1b2c3d` | References specific commit by hash | "What changed in commit @a1b2c3d?" |
|
||||
| **Git Changes** | `@git-changes` | Shows uncommitted changes | "Suggest a message for @git-changes" |
|
||||
| **URL** | `@https://example.com` | Imports website content | "Summarize @https://docusaurus.io/" |
|
||||
|
||||
### File Mentions
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions-1.png" alt="File mention example showing a file being referenced with @ and its contents appearing in the conversation" width="600" />
|
||||
|
||||
*File mentions incorporate source code with line numbers for precise references.*
|
||||
| Capability | Details |
|
||||
|------------|---------|
|
||||
| **Format** | `@/path/to/file.ts` (always start with `/` from workspace root) |
|
||||
| **Provides** | Complete file contents with line numbers |
|
||||
| **Supports** | Text files, PDFs, and DOCX files (with text extraction) |
|
||||
| **Works in** | Initial requests, feedback responses, and follow-up messages |
|
||||
| **Limitations** | Very large files may be truncated; binary files not supported |
|
||||
|
||||
### Folder Mentions
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions-2.png" alt="Folder mention example showing directory contents being referenced in the chat" width="600" />
|
||||
|
||||
*Folder mentions display directory structure in a readable tree format.*
|
||||
| Capability | Details |
|
||||
|------------|---------|
|
||||
| **Format** | `@/path/to/folder/` (note trailing slash) |
|
||||
| **Provides** | Hierarchical tree display with ├── and └── prefixes |
|
||||
| **Includes** | Immediate child files and directories (not recursive) |
|
||||
| **Best for** | Understanding project structure |
|
||||
| **Tip** | Use with file mentions to check specific file contents |
|
||||
|
||||
### Problems Mention
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions-3.png" alt="Problems mention example showing VS Code problems panel being referenced with @problems" width="600" />
|
||||
|
||||
*Problems mentions import diagnostics directly from VS Code's problems panel.*
|
||||
| Capability | Details |
|
||||
|------------|---------|
|
||||
| **Format** | `@problems` |
|
||||
| **Provides** | All errors and warnings from VS Code's problems panel |
|
||||
| **Includes** | File paths, line numbers, and diagnostic messages |
|
||||
| **Groups** | Problems organized by file for better clarity |
|
||||
| **Best for** | Fixing errors without manual copying |
|
||||
|
||||
### Terminal Mention
|
||||
<img src="/docs/img/context-mentions/context-mentions-4.png" alt="Terminal mention example showing terminal output being included in Kilo Code's context" width="600" />
|
||||
|
||||
*Terminal mentions capture recent command output for debugging and analysis.*
|
||||
|
||||
| Capability | Details |
|
||||
|------------|---------|
|
||||
| **Format** | `@terminal` |
|
||||
| **Captures** | Last command and its complete output |
|
||||
| **Preserves** | Terminal state (doesn't clear the terminal) |
|
||||
| **Limitation** | Limited to visible terminal buffer content |
|
||||
| **Best for** | Debugging build errors or analyzing command output |
|
||||
|
||||
### Git Mentions
|
||||
|
||||
<img src="/docs/img/context-mentions/context-mentions-5.png" alt="Git commit mention example showing commit details being analyzed by Kilo Code" width="600" />
|
||||
|
||||
*Git mentions provide commit details and diffs for context-aware version analysis.*
|
||||
| Type | Format | Provides | Limitations |
|
||||
|------|--------|----------|------------|
|
||||
| **Commit** | `@a1b2c3d` | Commit message, author, date, and complete diff | Only works in Git repositories |
|
||||
| **Working Changes** | `@git-changes` | `git status` output and diff of uncommitted changes | Only works in Git repositories |
|
||||
|
||||
### URL Mentions
|
||||
<img src="/docs/img/context-mentions/context-mentions-6.png" alt="URL mention example showing website content being converted to Markdown in the chat" width="600" />
|
||||
|
||||
*URL mentions import external web content and convert it to readable Markdown format.*
|
||||
|
||||
| Capability | Details |
|
||||
|------------|---------|
|
||||
| **Format** | `@https://example.com` |
|
||||
| **Processing** | Uses headless browser to fetch content |
|
||||
| **Cleaning** | Removes scripts, styles, and navigation elements |
|
||||
| **Output** | Converts content to Markdown for readability |
|
||||
| **Limitation** | Complex pages may not convert perfectly |
|
||||
|
||||
## How to Use Mentions
|
||||
|
||||
1. Type `@` in the chat input to trigger the suggestions dropdown
|
||||
2. Continue typing to filter suggestions or use arrow keys to navigate
|
||||
3. Select with Enter key or mouse click
|
||||
4. Combine multiple mentions in a request: "Fix @problems in @/src/component.ts"
|
||||
|
||||
The dropdown automatically suggests:
|
||||
- Recently opened files
|
||||
- Visible folders
|
||||
- Recent git commits
|
||||
- Special keywords (`problems`, `terminal`, `git-changes`)
|
||||
|
||||
## Best Practices
|
||||
|
||||
| Practice | Description |
|
||||
|----------|-------------|
|
||||
| **Use specific paths** | Reference exact files rather than describing them |
|
||||
| **Use relative paths** | Always start from workspace root: `@/src/file.ts` not `@C:/Projects/src/file.ts` |
|
||||
| **Verify references** | Ensure paths and commit hashes are correct |
|
||||
| **Click mentions** | Click mentions in chat history to open files or view content |
|
||||
| **Eliminate copy-pasting** | Use mentions instead of manually copying code or errors |
|
||||
| **Combine mentions** | "Fix @problems in @/src/component.ts using the pattern from commit @a1b2c3d" |
|
||||
@@ -1,83 +0,0 @@
|
||||
# How Tools Work
|
||||
|
||||
Kilo Code uses tools to interact with your code and environment. These specialized helpers perform specific actions like reading files, making edits, running commands, or searching your codebase. Tools provide automation for common development tasks without requiring manual execution.
|
||||
|
||||
## Tool Workflow
|
||||
|
||||
Describe what you want to accomplish in natural language, and Kilo Code will:
|
||||
|
||||
1. Select the appropriate tool based on your request
|
||||
2. Present the tool with its parameters for your review
|
||||
3. Execute the approved tool and show you the results
|
||||
4. Continue this process until your task is complete
|
||||
|
||||
## Tool Categories
|
||||
|
||||
| Category | Purpose | Tool Names |
|
||||
| :------- | :------ | :--------- |
|
||||
| Read | Access file content and code structure | `read_file`, `search_files`, `list_files`, `list_code_definition_names` |
|
||||
| Edit | Create or modify files and code | `write_to_file`, `apply_diff` |
|
||||
| Execute | Run commands and perform system operations | `execute_command` |
|
||||
| Browser | Interact with web content | `browser_action` |
|
||||
| Workflow | Manage task flow and context | `ask_followup_question`, `attempt_completion`, `switch_mode`, `new_task` |
|
||||
|
||||
## Example: Using Tools
|
||||
|
||||
Here's how a typical tool interaction works:
|
||||
|
||||
<img src="/docs/img/how-tools-work/how-tools-work.png" alt="Tool approval interface showing Save and Reject buttons along with Auto-approve checkbox" width="600" />
|
||||
|
||||
*The tool approval interface shows Save/Reject buttons and Auto-approve options.*
|
||||
|
||||
**User:** Create a file named `greeting.js` that logs a greeting message
|
||||
|
||||
**Kilo Code:** (Proposes the `write_to_file` tool as shown in the image above)
|
||||
```xml
|
||||
<write_to_file>
|
||||
<path>greeting.js</path>
|
||||
<content>
|
||||
function greet(name) {
|
||||
console.log(`Hello, ${name}!`);
|
||||
}
|
||||
|
||||
greet('World');
|
||||
</content>
|
||||
<line_count>5</line_count>
|
||||
</write_to_file>
|
||||
```
|
||||
|
||||
**User:** (Clicks "Save" in the interface)
|
||||
|
||||
**Kilo Code:** (Confirms file creation)
|
||||
|
||||
## Tool Safety and Approval
|
||||
|
||||
|
||||
Every tool use requires your explicit approval. When Kilo proposes a tool, you'll see:
|
||||
|
||||
* A "Save" button to approve and execute the tool
|
||||
* A "Reject" button to decline the proposed tool
|
||||
* An optional "Auto-approve" setting for trusted operations
|
||||
|
||||
This safety mechanism ensures you maintain control over which files are modified, what commands are executed, and how your codebase is changed. Always review tool proposals carefully before saving them.
|
||||
|
||||
## Core Tools Reference
|
||||
|
||||
| Tool Name | Description | Category |
|
||||
| :-------- | :---------- | :------- |
|
||||
| `read_file` | Reads the content of a file with line numbers | Read |
|
||||
| `search_files` | Searches for text or regex patterns across files | Read |
|
||||
| `list_files` | Lists files and directories in a specified location | Read |
|
||||
| `list_code_definition_names` | Lists code definitions like classes and functions | Read |
|
||||
| `write_to_file` | Creates new files or overwrites existing ones | Edit |
|
||||
| `apply_diff` | Makes precise changes to specific parts of a file | Edit |
|
||||
| `execute_command` | Runs commands in the VS Code terminal | Execute |
|
||||
| `browser_action` | Performs actions in a headless browser | Browser |
|
||||
| `ask_followup_question` | Asks you a clarifying question | Workflow |
|
||||
| `attempt_completion` | Indicates the task is complete | Workflow |
|
||||
| `switch_mode` | Changes to a different operational mode | Workflow |
|
||||
| `new_task` | Creates a new subtask with a specific starting mode | Workflow |
|
||||
|
||||
## Learn More About Tools
|
||||
|
||||
For more detailed information about each tool, including complete parameter references and advanced usage patterns, see the [Tool Use Overview](/features/tools/tool-use-overview) documentation.
|
||||
@@ -1,84 +0,0 @@
|
||||
---
|
||||
sidebar_label: "Model Selection Guide"
|
||||
---
|
||||
|
||||
# Kilo Code Model Selection Guide
|
||||
|
||||
Last updated: September 3, 2025.
|
||||
|
||||
The AI model landscape evolves rapidly, so this guide focuses on what's delivering excellent results with Kilo Code right now. We update this regularly as new models emerge and performance shifts.
|
||||
|
||||
## Kilo Code Top Performers
|
||||
|
||||
| Model | Context Window | SWE-Bench Verified | Human Eval | LiveCodeBench | Input Price\* | Output Price\* | Best For |
|
||||
| -------------------- | -------------- | ------------------ | ---------- | ------------- | ------------- | -------------- | ------------------------------------------- |
|
||||
| **GPT-5** | 400K tokens | 74.9% | 96.3% | 68.2% | $1.25 | $10 | Latest capabilities, multi-modal coding |
|
||||
| **Claude Sonnet 4** | 1M tokens | 72.7% | 94.8% | 65.9% | $3-6 | $15-22.50 | Enterprise code generation, complex systems |
|
||||
| **Grok Code Fast 1** | 256K tokens | 70.8% | 92.1% | 63.4% | $0.20 | $1.50 | Rapid development, cost-performance balance |
|
||||
| **Qwen3 Coder** | 256K tokens | 68.4% | 91.7% | 61.8% | $0.20 | $0.80 | Pure coding tasks, rapid prototyping |
|
||||
| **Gemini 2.5 Pro** | 1M+ tokens | 67.2% | 89.9% | 59.3% | TBD | TBD | Massive codebases, architectural planning |
|
||||
|
||||
\*Per million tokens
|
||||
|
||||
## Budget-Conscious Options
|
||||
|
||||
| Model | Context Window | SWE-Bench Verified | Human Eval | LiveCodeBench | Input Price\* | Output Price\* | Notes |
|
||||
| ---------------- | -------------- | ------------------ | ---------- | ------------- | ------------- | -------------- | ------------------------------------ |
|
||||
| **DeepSeek V3** | 128K tokens | 64.1% | 87.3% | 56.7% | $0.14 | $0.28 | Exceptional value for daily coding |
|
||||
| **DeepSeek R1** | 128K tokens | 62.8% | 85.9% | 54.2% | $0.55 | $2.19 | Advanced reasoning at budget prices |
|
||||
| **Qwen3 32B** | 128K tokens | 60.3% | 83.4% | 52.1% | Varies | Varies | Open source flexibility |
|
||||
| **Z AI GLM 4.5** | 128K tokens | 58.7% | 81.2% | 49.8% | TBD | TBD | MIT license, hybrid reasoning system |
|
||||
|
||||
\*Per million tokens
|
||||
|
||||
## Comprehensive Evaluation Framework
|
||||
|
||||
### Latency Performance
|
||||
|
||||
Response times significantly impact development flow and productivity:
|
||||
|
||||
- **Ultra-Fast (< 2s)**: Grok Code Fast 1, Qwen3 Coder
|
||||
- **Fast (2-4s)**: DeepSeek V3, GPT-5
|
||||
- **Moderate (4-8s)**: Claude Sonnet 4, DeepSeek R1
|
||||
- **Slower (8-15s)**: Gemini 2.5 Pro, Z AI GLM 4.5
|
||||
|
||||
**Impact on Development**: Ultra-fast models enable real-time coding assistance and immediate feedback loops. Models with 8+ second latency can disrupt flow state but may be acceptable for complex architectural decisions.
|
||||
|
||||
### Throughput Analysis
|
||||
|
||||
Token generation rates affect large codebase processing:
|
||||
|
||||
- **High Throughput (150+ tokens/s)**: GPT-5, Grok Code Fast 1
|
||||
- **Medium Throughput (100-150 tokens/s)**: Claude Sonnet 4, Qwen3 Coder
|
||||
- **Standard Throughput (50-100 tokens/s)**: DeepSeek models, Gemini 2.5 Pro
|
||||
- **Variable Throughput**: Open source models depend on infrastructure
|
||||
|
||||
**Scaling Factors**: High throughput models excel when generating extensive documentation, refactoring large files, or batch processing multiple components.
|
||||
|
||||
### Reliability & Availability
|
||||
|
||||
Enterprise considerations for production environments:
|
||||
|
||||
- **Enterprise Grade (99.9%+ uptime)**: Claude Sonnet 4, GPT-5, Gemini 2.5 Pro
|
||||
- **Production Ready (99%+ uptime)**: Qwen3 Coder, Grok Code Fast 1
|
||||
- **Developing Reliability**: DeepSeek models, Z AI GLM 4.5
|
||||
- **Self-Hosted**: Qwen3 32B (reliability depends on your infrastructure)
|
||||
|
||||
**Success Rates**: Enterprise models maintain consistent output quality and handle edge cases more gracefully, while budget options may require additional validation steps.
|
||||
|
||||
### Context Window Strategy
|
||||
|
||||
Optimizing for different project scales:
|
||||
|
||||
| Size | Word Count | Typical Use Case | Recommended Models | Strategy |
|
||||
| ---------------- | --------------- | ------------------------------------- | -------------------------------------- | ----------------------------------------------- |
|
||||
| **32K tokens** | ~24,000 words | Individual components, scripts | DeepSeek V3, Qwen3 Coder | Focus on single-file optimization |
|
||||
| **128K tokens** | ~96,000 words | Standard applications, most projects | All budget models, Grok Code Fast 1 | Multi-file context, moderate complexity |
|
||||
| **256K tokens** | ~192,000 words | Large applications, multiple services | Qwen3 Coder, Grok Code Fast 1 | Full feature context, service integration |
|
||||
| **400K+ tokens** | ~300,000+ words | Enterprise systems, full stack apps | GPT-5, Claude Sonnet 4, Gemini 2.5 Pro | Architectural overview, system-wide refactoring |
|
||||
|
||||
**Performance Degradation**: Model effectiveness typically drops significantly beyond 400-500K tokens, regardless of advertised limits. Plan context usage accordingly.
|
||||
|
||||
## Community Choice
|
||||
|
||||
The AI model landscape changes quicky to stay up to date [**👉 check Kilo Code Community Favorites on OpenRouter**](https://openrouter.ai/apps?url=https%3A%2F%2Fkilocode.ai%2F)
|
||||
@@ -1,48 +0,0 @@
|
||||
---
|
||||
sidebar_label: 'Orchestrator Mode'
|
||||
---
|
||||
|
||||
import YouTubeEmbed from '@site/src/components/YouTubeEmbed';
|
||||
|
||||
# Orchestrator Mode: Coordinate Complex Workflows
|
||||
|
||||
Orchestrator Mode (formerly known as Boomerang Tasks) allows you to break down complex projects into smaller, manageable pieces. Think of it like delegating parts of your work to specialized assistants. Each subtask runs in its own context, often using a different Kilo Code mode tailored for that specific job (like [`code`](/basic-usage/using-modes#code-mode-default), [`architect`](/basic-usage/using-modes#architect-mode), or [`debug`](/basic-usage/using-modes#debug-mode)).
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://www.youtube.com/watch?v=20MmJNeOODo"
|
||||
caption="Orchestrator Mode explained and demonstrated"
|
||||
/>
|
||||
|
||||
|
||||
## Why Use Orchestrator Mode?
|
||||
|
||||
- **Tackle Complexity:** Break large, multi-step projects (e.g., building a full feature) into focused subtasks (e.g., design, implementation, documentation).
|
||||
- **Use Specialized Modes:** Automatically delegate subtasks to the mode best suited for that specific piece of work, leveraging specialized capabilities for optimal results.
|
||||
- **Maintain Focus & Efficiency:** Each subtask operates in its own isolated context with a separate conversation history. This prevents the parent (orchestrator) task from becoming cluttered with the detailed execution steps (like code diffs or file analysis results), allowing it to focus efficiently on the high-level workflow and manage the overall process based on concise summaries from completed subtasks.
|
||||
- **Streamline Workflows:** Results from one subtask can be automatically passed to the next, creating a smooth flow (e.g., architectural decisions feeding into the coding task).
|
||||
|
||||
## How It Works
|
||||
|
||||
1. Using Orchestrator Mode, Kilo can analyze a complex task and suggest breaking it down into a subtask[^1].
|
||||
2. The parent task pauses, and the new subtask begins in a different mode[^2].
|
||||
3. When the subtask's goal is achieved, Kilo signals completion.
|
||||
4. The parent task resumes with only the summary[^3] of the subtask. The parent uses this summary to continue the main workflow.
|
||||
|
||||
## Key Considerations
|
||||
|
||||
- **Approval Required:** By default, you must approve the creation and completion of each subtask. This can be automated via the [Auto-Approving Actions](/features/auto-approving-actions#subtasks) settings if desired.
|
||||
- **Context Isolation and Transfer:** Each subtask operates in complete isolation with its own conversation history. It does not automatically inherit the parent's context. Information must be explicitly passed:
|
||||
* **Down:** Via the initial instructions provided when the subtask is created.
|
||||
* **Up:** Via the final summary provided when the subtask finishes. Be mindful that only this summary returns to the parent.
|
||||
- **Navigation:** Kilo's interface helps you see the hierarchy of tasks (which task is the parent, which are children). You can typically navigate between active and paused tasks.
|
||||
|
||||
Orchestrator Mode provides a powerful way to manage complex development workflows directly within Kilo Code, leveraging specialized modes for maximum efficiency.
|
||||
|
||||
:::tip Keep Tasks Focused
|
||||
Use subtasks to maintain clarity. If a request significantly shifts focus or requires a different expertise (mode), consider creating a subtask rather than overloading the current one.
|
||||
:::
|
||||
|
||||
|
||||
[^1]: This context is passed via the `message` parameter of the [`new_task`](/features/tools/new-task) tool.
|
||||
[^2]: The mode for the subtask is specified via the `mode` parameter of the [`new_task`](/features/tools/new-task) tool during initiation.
|
||||
[^3]: This summary is passed via the `result` parameter of the [`attempt_completion`](/features/tools/attempt-completion) tool when the subtask finishes.
|
||||
@@ -1,93 +0,0 @@
|
||||
# Task Todo List
|
||||
|
||||
**The big picture**: Never lose track of complex development tasks again. Task Todo Lists create interactive, persistent checklists that live right in your chat interface.
|
||||
|
||||
**Why it matters**: Complex workflows have lots of moving parts. Without structure, it's easy to miss steps, duplicate work, or forget what comes next.
|
||||
|
||||
<img src="/docs/img/task-todo-list/task-todo-list-1.png" alt="Task Todo List overview showing interactive checklist in Kilo Code" width="500" />
|
||||
|
||||
## How to trigger todo lists
|
||||
|
||||
**Automatic triggers**:
|
||||
- Complex tasks with multiple steps
|
||||
- Working in Architect mode
|
||||
- Multi-phase workflows with dependencies
|
||||
|
||||
**Manual triggers**:
|
||||
- Ask Kilo to "use the [update_todo_list tool](/features/tools/update-todo-list)"
|
||||
- Say "create a todo list"
|
||||
|
||||
**The bottom line**: Kilo decides what goes in the list, but you can provide feedback during approval dialogs.
|
||||
|
||||
---
|
||||
|
||||
## The old way vs. the new way
|
||||
|
||||
**Before**: You juggled task steps in your head or scattered notes, constantly wondering "what's next?"
|
||||
|
||||
**Now**: Kilo creates structured checklists that update automatically as work progresses. You see exactly where you are and what's coming up.
|
||||
|
||||
---
|
||||
|
||||
## Where todo lists appear
|
||||
|
||||
**1. Task Header Summary**
|
||||
Quick progress overview with your next important item
|
||||
|
||||
<img src="/docs/img/task-todo-list/task-header.png" alt="Task header summary showing todo list progress" width="500" />
|
||||
|
||||
**2. Interactive Tool Block**
|
||||
Full todo interface in chat where you can:
|
||||
- See all items and their status
|
||||
- Edit descriptions when Kilo asks for approval
|
||||
- Stage changes using the "Edit" button
|
||||
|
||||
**3. Environment Details**
|
||||
Background "REMINDERS" table that keeps Kilo informed about current progress
|
||||
|
||||
## Task status decoded
|
||||
|
||||
**Pending** → Empty checkbox (not started)
|
||||
|
||||
<img src="/docs/img/task-todo-list/not-started.png" alt="Pending todo item with empty checkbox" width="300" />
|
||||
|
||||
---
|
||||
|
||||
**In Progress** → Yellow dot (currently working)
|
||||
|
||||
<img src="/docs/img/task-todo-list/in-progress.png" alt="In progress todo item with yellow dot indicator" width="300" />
|
||||
|
||||
---
|
||||
|
||||
**Completed** → Green checkmark (finished)
|
||||
|
||||
<img src="/docs/img/task-todo-list/complete.png" alt="Completed todo item with green checkmark" width="300" />
|
||||
|
||||
---
|
||||
|
||||
## Common questions
|
||||
|
||||
**"Can I create my own todo lists?"**
|
||||
Yes, just ask Kilo to use the update_todo_list tool. But Kilo stays in control of the content and workflow.
|
||||
|
||||
**"What about simple tasks?"**
|
||||
Kilo typically skips todo lists for simple tasks. The overhead isn't worth it.
|
||||
|
||||
**"Why can't I directly edit the list?"**
|
||||
Design choice. Kilo maintains authority over task management to ensure consistent progress tracking. You provide input, Kilo executes.
|
||||
|
||||
---
|
||||
|
||||
:::tip
|
||||
|
||||
## Pro tip: Auto-approval
|
||||
|
||||
**What it does**: Automatically approves todo list updates without confirmation prompts.
|
||||
|
||||
**When to use it**: Long workflows where constant interruptions slow you down.
|
||||
|
||||
**How to enable it**: Check the [Update Todo List auto-approval settings](/features/auto-approving-actions#update-todo-list).
|
||||
|
||||
**The catch**: Less control, but faster execution.
|
||||
|
||||
:::
|
||||
@@ -1,83 +0,0 @@
|
||||
import Image from '@site/src/components/Image';
|
||||
|
||||
# Chatting with Kilo Code
|
||||
|
||||
:::tip
|
||||
|
||||
**Bottom line:** Kilo Code is an AI coding assistant that lives in VS Code. You chat with it in plain English, and it writes, edits, and explains code for you.
|
||||
|
||||
:::
|
||||
|
||||
## Quick Setup
|
||||
|
||||
Find the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in VS Code's Primary Side Bar. Click it to open the chat panel.
|
||||
|
||||
**Lost the panel?** Go to View > Open View... and search for "Kilo Code"
|
||||
|
||||
## How to Talk to Kilo Code
|
||||
|
||||
**The key insight:** Just type what you want in normal English. No special commands needed.
|
||||
|
||||
<Image src="/docs/img/typing-your-requests/typing-your-requests.png" alt="Example of typing a request in Kilo Code" width="600" />
|
||||
|
||||
**Good requests:**
|
||||
|
||||
```
|
||||
create a new file named utils.py and add a function called add that takes two numbers as arguments and returns their sum
|
||||
```
|
||||
|
||||
```
|
||||
in the file @src/components/Button.tsx, change the color of the button to blue
|
||||
```
|
||||
|
||||
```
|
||||
find all instances of the variable oldValue in @/src/App.js and replace them with newValue
|
||||
```
|
||||
|
||||
**What makes requests work:**
|
||||
- **Be specific** - "Fix the bug in `calculateTotal` that returns incorrect results" beats "Fix the code"
|
||||
- **Use @ mentions** - Reference files and code directly with `@filename`
|
||||
- **One task at a time** - Break complex work into manageable steps
|
||||
- **Include examples** - Show the style or format you want
|
||||
|
||||
|
||||
## The Chat Interface
|
||||
|
||||
<Image
|
||||
src="/docs/img/the-chat-interface/the-chat-interface-1.png"
|
||||
alt="Chat interface components labeled with callouts" width="750"
|
||||
caption="Everything you need is right here"
|
||||
/>
|
||||
|
||||
**Essential controls:**
|
||||
- **Chat history** - See your conversation and task history
|
||||
- **Input field** - Type your requests here (press Enter to send)
|
||||
- **Action buttons** - Approve or reject Kilo's proposed changes
|
||||
- **Plus button** - Start a new task session
|
||||
- **Mode selector** - Choose how Kilo should approach your task
|
||||
|
||||
## Quick Interactions
|
||||
|
||||
**Click to act:**
|
||||
- File paths → Opens the file
|
||||
- URLs → Opens in browser
|
||||
- Messages → Expand/collapse details
|
||||
- Code blocks → Copy button appears
|
||||
|
||||
**Status signals:**
|
||||
- Spinning → Kilo is working
|
||||
- Red → Error occurred
|
||||
- Green → Success
|
||||
|
||||
## Common Mistakes to Avoid
|
||||
|
||||
| Instead of this... | Try this |
|
||||
|-------------------|----------|
|
||||
| "Fix the code" | "Fix the bug in `calculateTotal` that returns incorrect results" |
|
||||
| Assuming Kilo knows context | Use `@` to reference specific files |
|
||||
| Multiple unrelated tasks | Submit one focused request at a time |
|
||||
| Technical jargon overload | Clear, straightforward language works best |
|
||||
|
||||
**Why it matters:** Kilo Code works best when you communicate like you're talking to a smart teammate who needs clear direction.
|
||||
|
||||
Ready to start coding? Open the chat panel and describe what you want to build!
|
||||
@@ -1,90 +0,0 @@
|
||||
# Using Modes
|
||||
|
||||
Modes in Kilo Code are specialized personas that tailor the assistant's behavior to your current task. Each mode offers different capabilities, expertise, and access levels to help you accomplish specific goals.
|
||||
|
||||
## Why Use Different Modes?
|
||||
|
||||
- **Task specialization:** Get precisely the type of assistance you need for your current task
|
||||
- **Safety controls:** Prevent unintended file modifications when focusing on planning or learning
|
||||
- **Focused interactions:** Receive responses optimized for your current activity
|
||||
- **Workflow optimization:** Seamlessly transition between planning, implementing, debugging, and learning
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://youtu.be/cS4vQfX528w"
|
||||
caption="Explaining the different modes in Kilo Code"
|
||||
/>
|
||||
|
||||
## Switching Between Modes
|
||||
|
||||
Four ways to switch modes:
|
||||
|
||||
1. **Dropdown menu:** Click the selector to the left of the chat input
|
||||
|
||||
<img src="/docs/img/modes/modes.png" alt="Using the dropdown menu to switch modes" width="400" />
|
||||
|
||||
2. **Slash command:** Type `/architect`, `/ask`, `/debug`, or `/code` in the chat input
|
||||
|
||||
<img src="/docs/img/modes/modes-1.png" alt="Using slash commands to switch modes" width="400" />
|
||||
|
||||
3. **Toggle command/Keyboard shortcut:** Use the keyboard shortcut below, applicable to your operating system. Each press cycles through the available modes in sequence, wrapping back to the first mode after reaching the end.
|
||||
|
||||
| Operating System | Shortcut |
|
||||
|------------------|----------|
|
||||
| macOS | ⌘ + . |
|
||||
| Windows | Ctrl + . |
|
||||
| Linux | Ctrl + . |
|
||||
|
||||
4. **Accept suggestions:** Click on mode switch suggestions that Kilo Code offers when appropriate
|
||||
|
||||
<img src="/docs/img/modes/modes-2.png" alt="Accepting a mode switch suggestion from Kilo Code" width="400" />
|
||||
|
||||
## Built-in Modes
|
||||
|
||||
### Code Mode (Default)
|
||||
|
||||
| Aspect | Details |
|
||||
|--------|---------|
|
||||
| **Description** | A skilled software engineer with expertise in programming languages, design patterns, and best practices |
|
||||
| **Tool Access** | Full access to all tool groups: `read`, `edit`, `browser`, `command`, `mcp` |
|
||||
| **Ideal For** | Writing code, implementing features, debugging, and general development |
|
||||
| **Special Features** | No tool restrictions—full flexibility for all coding tasks |
|
||||
|
||||
### Ask Mode
|
||||
|
||||
| Aspect | Details |
|
||||
|--------|---------|
|
||||
| **Description** | A knowledgeable technical assistant focused on answering questions without changing your codebase |
|
||||
| **Tool Access** | Limited access: `read`, `browser`, `mcp` only (cannot edit files or run commands) |
|
||||
| **Ideal For** | Code explanation, concept exploration, and technical learning |
|
||||
| **Special Features** | Optimized for informative responses without modifying your project |
|
||||
|
||||
### Architect Mode
|
||||
|
||||
| Aspect | Details |
|
||||
|--------|---------|
|
||||
| **Description** | An experienced technical leader and planner who helps design systems and create implementation plans |
|
||||
| **Tool Access** | Access to `read`, `browser`, `mcp`, and restricted `edit` (markdown files only) |
|
||||
| **Ideal For** | System design, high-level planning, and architecture discussions |
|
||||
| **Special Features** | Follows a structured approach from information gathering to detailed planning |
|
||||
|
||||
### Debug Mode
|
||||
|
||||
| Aspect | Details |
|
||||
|--------|---------|
|
||||
| **Description** | An expert problem solver specializing in systematic troubleshooting and diagnostics |
|
||||
| **Tool Access** | Full access to all tool groups: `read`, `edit`, `browser`, `command`, `mcp` |
|
||||
| **Ideal For** | Tracking down bugs, diagnosing errors, and resolving complex issues |
|
||||
| **Special Features** | Uses a methodical approach of analyzing, narrowing possibilities, and fixing issues |
|
||||
|
||||
### Orchestrator Mode
|
||||
|
||||
| Aspect | Details |
|
||||
|--------|---------|
|
||||
| **Description** | A strategic workflow orchestrator who coordinates complex tasks by delegating them to appropriate specialized modes |
|
||||
| **Tool Access** | Limited access to create new tasks and coordinate workflows |
|
||||
| **Ideal For** | Breaking down complex projects into manageable subtasks assigned to specialized modes |
|
||||
| **Special Features** | Uses the new_task tool to delegate work to other modes |
|
||||
|
||||
## Custom Modes
|
||||
|
||||
Create your own specialized assistants by defining tool access, file permissions, and behavior instructions. Custom modes help enforce team standards or create purpose-specific assistants. See [Custom Modes documentation](/features/custom-modes) for setup instructions.
|
||||
@@ -1,125 +0,0 @@
|
||||
# Contributing to Kilo Code
|
||||
|
||||
Kilo Code is an open-source project that welcomes contributions from developers of all skill levels. This guide will help you get started with contributing to Kilo Code, whether you're fixing bugs, adding features, improving documentation, or sharing custom modes.
|
||||
|
||||
## Ways to Contribute
|
||||
|
||||
There are many ways to contribute to Kilo Code:
|
||||
|
||||
1. **Code Contributions**: Implement new features or fix bugs
|
||||
2. **Documentation**: Improve existing docs or create new guides
|
||||
3. **Custom Modes**: Create and share specialized modes
|
||||
4. **Bug Reports**: Report issues you encounter
|
||||
5. **Feature Requests**: Suggest new features or improvements
|
||||
6. **Community Support**: Help other users in the community
|
||||
|
||||
## Setting Up the Development Environment
|
||||
|
||||
Setting Up the Development Environment is described in details on [this page](/docs/extending/development-environment.md)
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Branching Strategy
|
||||
|
||||
- Create a new branch for each feature or bugfix
|
||||
- Use descriptive branch names (e.g., `feature/new-tool-support` or `fix/browser-action-bug`)
|
||||
|
||||
```bash
|
||||
git checkout -b your-branch-name
|
||||
```
|
||||
|
||||
### Coding Standards
|
||||
|
||||
- Follow the existing code style and patterns
|
||||
- Use TypeScript for new code
|
||||
- Include appropriate tests for new features
|
||||
- Update documentation for any user-facing changes
|
||||
|
||||
### Commit Guidelines
|
||||
|
||||
- Write clear, concise commit messages
|
||||
- Reference issue numbers when applicable
|
||||
- Keep commits focused on a single change
|
||||
|
||||
### Testing Your Changes
|
||||
|
||||
- Run the test suite:
|
||||
```bash
|
||||
npm test
|
||||
```
|
||||
- Manually test your changes in the development extension
|
||||
|
||||
### Creating a Pull Request
|
||||
|
||||
1. Push your changes to your fork:
|
||||
```bash
|
||||
git push origin your-branch-name
|
||||
```
|
||||
|
||||
2. Go to the [Kilo Code repository](https://github.com/Kilo-Org/kilocode)
|
||||
|
||||
3. Click "New Pull Request" and select "compare across forks"
|
||||
|
||||
4. Select your fork and branch
|
||||
|
||||
5. Fill out the PR template with:
|
||||
- A clear description of the changes
|
||||
- Any related issues
|
||||
- Testing steps
|
||||
- Screenshots (if applicable)
|
||||
|
||||
## Creating Custom Modes
|
||||
|
||||
Custom modes are a powerful way to extend Kilo Code's capabilities. To create and share a custom mode:
|
||||
|
||||
1. Follow the [Custom Modes documentation](/features/custom-modes) to create your mode
|
||||
|
||||
2. Test your mode thoroughly
|
||||
|
||||
3. Share your mode with the community by submitting a [GitHub Discussion](https://github.com/Kilo-Org/kilocode/discussions)
|
||||
|
||||
## Documentation Contributions
|
||||
|
||||
Documentation improvements are highly valued contributions:
|
||||
|
||||
1. Follow the documentation style guide:
|
||||
- Use clear, concise language
|
||||
- Include examples where appropriate
|
||||
- Use absolute paths starting from `/docs/` for internal links
|
||||
- Don't include `.md` extensions in links
|
||||
|
||||
2. Test your documentation changes by running the docs site locally:
|
||||
```bash
|
||||
cd docs
|
||||
npm install
|
||||
npm start
|
||||
```
|
||||
|
||||
3. Submit a PR with your documentation changes
|
||||
|
||||
## Community Guidelines
|
||||
|
||||
When participating in the Kilo Code community:
|
||||
|
||||
- Be respectful and inclusive
|
||||
- Provide constructive feedback
|
||||
- Help newcomers get started
|
||||
- Follow the [Code of Conduct](https://github.com/Kilo-Org/kilocode/blob/main/CODE_OF_CONDUCT.md)
|
||||
|
||||
## Getting Help
|
||||
|
||||
If you need help with your contribution:
|
||||
|
||||
- Join our [Discord community](https://kilocode.ai/discord) for real-time support
|
||||
- Ask questions on [GitHub Discussions](https://github.com/Kilo-Org/kilocode/discussions)
|
||||
- Visit our [Reddit community](https://www.reddit.com/r/KiloCode)
|
||||
|
||||
## Recognition
|
||||
|
||||
All contributors are valued members of the Kilo Code community. Contributors are recognized in:
|
||||
|
||||
- Release notes
|
||||
- The project's README
|
||||
- The contributors list on GitHub
|
||||
|
||||
Thank you for contributing to Kilo Code and helping make AI-powered coding assistance better for everyone!
|
||||
@@ -1,192 +0,0 @@
|
||||
# Development Environment
|
||||
|
||||
<!-- Please refer to the [DEVELOPMENT.md](https://github.com/Kilo-Org/kilocode/blob/main/DEVELOPMENT.md) guide in the main repository for detailed instructions on setting up the development environment. -->
|
||||
|
||||
This document will help you set up your development environment and understand how to work with the codebase. Whether you're fixing bugs, adding features, or just exploring the code, this guide will get you started.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
Before you begin, make sure you have the following installed:
|
||||
|
||||
1. **Git** - For version control
|
||||
2. **Node.js** (version [v20.18.1](https://github.com/Kilo-Org/kilocode/blob/main/.nvmrc) or higher recommended) and npm
|
||||
3. **Visual Studio Code** - Our recommended IDE for development
|
||||
|
||||
## Getting Started
|
||||
|
||||
### Installation
|
||||
|
||||
1. **Fork and Clone the Repository**:
|
||||
|
||||
- **Fork the Repository**:
|
||||
- Visit the [Kilo Code GitHub repository](https://github.com/Kilo-Org/kilocode)
|
||||
- Click the "Fork" button in the top-right corner to create your own copy.
|
||||
- **Clone Your Fork**:
|
||||
```bash
|
||||
git clone https://github.com/[YOUR-USERNAME]/kilocode.git
|
||||
cd kilocode
|
||||
```
|
||||
Replace `[YOUR-USERNAME]` with your actual GitHub username.
|
||||
|
||||
1. **Install dependencies**:
|
||||
|
||||
```bash
|
||||
pnpm install
|
||||
```
|
||||
|
||||
This command will install dependencies for the main extension, webview UI, and e2e tests.
|
||||
|
||||
1. **Install VSCode Extensions**:
|
||||
- **Required**: [ESBuild Problem Matchers](https://marketplace.visualstudio.com/items?itemName=connor4312.esbuild-problem-matchers) - Helps display build errors correctly.
|
||||
|
||||
While not strictly necessary for running the extension, these extensions are recommended for development:
|
||||
|
||||
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - Integrates ESLint into VS Code.
|
||||
- [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Integrates Prettier into VS Code.
|
||||
|
||||
The full list of recommended extensions is [here](https://github.com/Kilo-Org/kilocode/blob/main/.vscode/extensions.json)
|
||||
|
||||
### Project Structure
|
||||
|
||||
The project is organized into several key directories:
|
||||
|
||||
- **`src/`** - Core extension code
|
||||
- **`core/`** - Core functionality and tools
|
||||
- **`services/`** - Service implementations
|
||||
- **`webview-ui/`** - Frontend UI code
|
||||
- **`e2e/`** - End-to-end tests
|
||||
- **`scripts/`** - Utility scripts
|
||||
- **`assets/`** - Static assets like images and icons
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Building the Extension
|
||||
|
||||
To build the extension:
|
||||
|
||||
```bash
|
||||
pnpm build
|
||||
```
|
||||
|
||||
This will:
|
||||
|
||||
1. Build the webview UI
|
||||
2. Compile TypeScript
|
||||
3. Bundle the extension
|
||||
4. Create a `.vsix` file in the `bin/` directory
|
||||
|
||||
### Running the Extension
|
||||
|
||||
To run the extension in development mode:
|
||||
|
||||
1. Press `F5` (or select **Run** → **Start Debugging**) in VSCode
|
||||
2. This will open a new VSCode window with Kilo Code loaded
|
||||
|
||||
### Hot Reloading
|
||||
|
||||
- **Webview UI changes**: Changes to the webview UI will appear immediately without restarting
|
||||
- **Core extension changes**: Changes to the core extension code will automatically reload the ext host
|
||||
|
||||
In development mode (NODE_ENV="development"), changing the core code will trigger a `workbench.action.reloadWindow` command, so it is no longer necessary to manually start/stop the debugger and tasks.
|
||||
|
||||
> **Important**: In production builds, when making changes to the core extension, you need to:
|
||||
>
|
||||
> 1. Stop the debugging process
|
||||
> 2. Kill any npm tasks running in the background (see screenshot below)
|
||||
> 3. Start debugging again
|
||||
|
||||
<img width="600" alt="Stopping background tasks" src="https://github.com/user-attachments/assets/466fb76e-664d-4066-a3f2-0df4d57dd9a4" />
|
||||
|
||||
### Installing the Built Extension
|
||||
|
||||
To install your built extension:
|
||||
|
||||
```bash
|
||||
code --install-extension "$(ls -1v bin/kilo-code-*.vsix | tail -n1)"
|
||||
```
|
||||
|
||||
Replace `[version]` with the current version number.
|
||||
|
||||
## Testing
|
||||
|
||||
Kilo Code uses several types of tests to ensure quality:
|
||||
|
||||
### Unit Tests
|
||||
|
||||
Run unit tests with:
|
||||
|
||||
```bash
|
||||
npm test
|
||||
```
|
||||
|
||||
This runs both extension and webview tests.
|
||||
|
||||
To run specific test suites:
|
||||
|
||||
```bash
|
||||
npm run test:extension # Run only extension tests
|
||||
npm run test:webview # Run only webview tests
|
||||
```
|
||||
|
||||
### End-to-End Tests
|
||||
|
||||
E2E tests verify the extension works correctly within VSCode:
|
||||
|
||||
1. Create a `.env.local` file in the root with required API keys:
|
||||
|
||||
```
|
||||
OPENROUTER_API_KEY=sk-or-v1-...
|
||||
```
|
||||
|
||||
2. Run the integration tests:
|
||||
```bash
|
||||
npm run test:integration
|
||||
```
|
||||
|
||||
For more details on E2E tests, see [e2e/VSCODE_INTEGRATION_TESTS.md](https://github.com/Kilo-Org/kilocode/blob/main/e2e/VSCODE_INTEGRATION_TESTS.md).
|
||||
|
||||
## Linting and Type Checking
|
||||
|
||||
Ensure your code meets our quality standards:
|
||||
|
||||
```bash
|
||||
npm run lint # Run ESLint
|
||||
npm run check-types # Run TypeScript type checking
|
||||
```
|
||||
|
||||
## Git Hooks
|
||||
|
||||
This project uses [Husky](https://typicode.github.io/husky/) to manage Git hooks, which automate certain checks before commits and pushes. The hooks are located in the `.husky/` directory.
|
||||
|
||||
### Pre-commit Hook
|
||||
|
||||
Before a commit is finalized, the `.husky/pre-commit` hook runs:
|
||||
|
||||
1. **Branch Check**: Prevents committing directly to the `main` branch.
|
||||
2. **Type Generation**: Runs `npm run generate-types`.
|
||||
3. **Type File Check**: Ensures that any changes made to `src/exports/roo-code.d.ts` by the type generation are staged.
|
||||
4. **Linting**: Runs `lint-staged` to lint and format staged files.
|
||||
|
||||
### Pre-push Hook
|
||||
|
||||
Before changes are pushed to the remote repository, the `.husky/pre-push` hook runs:
|
||||
|
||||
1. **Branch Check**: Prevents pushing directly to the `main` branch.
|
||||
2. **Compilation**: Runs `npm run compile` to ensure the project builds successfully.
|
||||
3. **Changeset Check**: Checks if a changeset file exists in `.changeset/` and reminds you to create one using `npm run changeset` if necessary.
|
||||
|
||||
These hooks help maintain code quality and consistency. If you encounter issues with commits or pushes, check the output from these hooks for error messages.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
1. **Extension not loading**: Check the VSCode Developer Tools (Help > Toggle Developer Tools) for errors
|
||||
2. **Webview not updating**: Try reloading the window (Developer: Reload Window)
|
||||
3. **Build errors**: Make sure all dependencies are installed with `npm run install:all`
|
||||
|
||||
### Debugging Tips
|
||||
|
||||
- Use `console.log()` statements in your code for debugging
|
||||
- Check the Output panel in VSCode (View > Output) and select "Kilo Code" from the dropdown
|
||||
- For webview issues, use the browser developer tools in the webview (right-click > "Inspect Element")
|
||||
@@ -1,180 +0,0 @@
|
||||
---
|
||||
---
|
||||
|
||||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||
|
||||
import { DISCORD_URL } from '@site/src/constants.ts'
|
||||
|
||||
# Frequently Asked Questions
|
||||
|
||||
This page answers some common questions about Kilo Code.
|
||||
|
||||
## General
|
||||
|
||||
### What is Kilo Code?
|
||||
|
||||
Kilo Code is an open-source AI agent extension for Visual Studio Code. It helps you write code more efficiently by generating code, automating tasks, and providing suggestions.
|
||||
|
||||
### How does Kilo Code work?
|
||||
|
||||
Kilo Code uses large language models (LLMs) to understand your requests and translate them into actions. It can:
|
||||
|
||||
- Read and write files in your project.
|
||||
- Execute commands in your VS Code terminal.
|
||||
- Perform web browsing (if enabled).
|
||||
- Use external tools via the Model Context Protocol (MCP).
|
||||
|
||||
You interact with Kilo Code through a chat interface, where you provide instructions and review/approve its proposed actions.
|
||||
|
||||
### What can Kilo Code do?
|
||||
|
||||
Kilo Code can help with a variety of coding tasks, including:
|
||||
|
||||
- Generating code from natural language descriptions.
|
||||
- Refactoring existing code.
|
||||
- Fixing bugs.
|
||||
- Writing documentation.
|
||||
- Explaining code.
|
||||
- Answering questions about your codebase.
|
||||
- Automating repetitive tasks.
|
||||
- Creating new files and projects.
|
||||
|
||||
### Is Kilo Code free to use?
|
||||
|
||||
The Kilo Code extension itself is free and open-source. If you're looking to earn some credits, you could join our <a href={DISCORD_URL} target='_blank'>Discord</a> where we sometimes have promotional offers!
|
||||
|
||||
After that, you can add a credit card to buy more tokens (securely processed through Stripe. Our pricing matches Anthropic's API rates exactly. We don't take any cut, either per token or per top-up. In the future we'll add more LLM providers.
|
||||
|
||||
Alternatively, you can "Bring Your Own API" (like [Anthropic](providers/anthropic), [OpenAI](providers/openai), [OpenRouter](providers/openrouter), [Requesty](providers/requesty), etc.) for its AI capabilities. These providers typically charge for API usage based on the number of tokens processed. You will need to create an account and obtain an API key from your chosen provider. See [Setting Up Your First AI Provider](getting-started/connecting-api-provider) for details.
|
||||
|
||||
### What are the risks of using Kilo Code?
|
||||
|
||||
Kilo Code is a powerful tool, and it's important to use it responsibly. Here are some things to keep in mind:
|
||||
|
||||
- **Kilo Code can make mistakes.** Always review Kilo Code's proposed changes carefully before approving them.
|
||||
- **Kilo Code can execute commands.** Be very cautious about allowing Kilo Code to run commands, especially if you're using auto-approval.
|
||||
- **Kilo Code can access the internet.** If you're using a provider that supports web browsing, be aware that Kilo Code could potentially access sensitive information.
|
||||
|
||||
## Setup & Installation
|
||||
|
||||
### How do I install Kilo Code?
|
||||
|
||||
See the [Installation Guide](/getting-started/installing) for detailed instructions.
|
||||
|
||||
### Which API providers are supported?
|
||||
|
||||
Kilo Code supports a wide range of API providers, including:
|
||||
|
||||
- [Anthropic (Claude)](/providers/kilocode)
|
||||
- [Anthropic (Claude)](/providers/anthropic)
|
||||
- [OpenAI](/providers/openai)
|
||||
- [OpenRouter](/providers/openrouter)
|
||||
- [Google Gemini](/providers/gemini)
|
||||
- [Glama](/providers/glama)
|
||||
- [AWS Bedrock](/providers/bedrock)
|
||||
- [GCP Vertex AI](/providers/vertex)
|
||||
- [Ollama](/providers/ollama)
|
||||
- [LM Studio](/providers/lmstudio)
|
||||
- [DeepSeek](/providers/deepseek)
|
||||
- [Mistral](/providers/mistral)
|
||||
- [Unbound](/providers/unbound)
|
||||
- [Requesty](/providers/requesty)
|
||||
- [VS Code Language Model API](/providers/vscode-lm)
|
||||
|
||||
### How do I get an API key?
|
||||
|
||||
Each API provider has its own process for obtaining an API key. See the [Setting Up Your First AI Provider](/getting-started/connecting-api-provider) for links to the relevant documentation for each provider.
|
||||
|
||||
### Can I use Kilo Code with local models?
|
||||
|
||||
Yes, Kilo Code supports running models locally using [Ollama](/providers/ollama) and [LM Studio](/providers/lmstudio). See [Using Local Models](/advanced-usage/local-models) for instructions.
|
||||
|
||||
## Usage
|
||||
|
||||
### How do I start a new task?
|
||||
|
||||
Open the Kilo Code panel (<img src="/docs/img/kilo-v1.svg" width="12" />) and type your task in the chat box. Be clear and specific about what you want Kilo Code to do. See [The Chat Interface](/basic-usage/the-chat-interface) for best practices.
|
||||
|
||||
### What are modes in Kilo Code?
|
||||
|
||||
[Modes](/basic-usage/using-modes) are different personas that Kilo Code can adopt, each with a specific focus and set of capabilities. The built-in modes are:
|
||||
|
||||
- **Code:** For general-purpose coding tasks.
|
||||
- **Architect:** For planning and technical leadership.
|
||||
- **Ask:** For answering questions and providing information.
|
||||
- **Debug:** For systematic problem diagnosis.
|
||||
You can also create [Custom Modes](/features/custom-modes).
|
||||
|
||||
### How do I switch between modes?
|
||||
|
||||
Use the dropdown menu in the chat input area to select a different mode, or use the `/` command to switch to a specific mode.
|
||||
|
||||
### What are tools and how do I use them?
|
||||
|
||||
[Tools](/basic-usage/how-tools-work) are how Kilo Code interacts with your system. Kilo Code automatically selects and uses the appropriate tools to complete your tasks. You don't need to call tools directly. You will be prompted to approve or reject each tool use.
|
||||
|
||||
### What are context mentions?
|
||||
|
||||
[Context mentions](/basic-usage/context-mentions) are a way to provide Kilo Code with specific information about your project, such as files, folders, or problems. Use the "@" symbol followed by the item you want to mention (e.g., `@/src/file.ts`, `@problems`).
|
||||
|
||||
### Can Kilo Code access the internet?
|
||||
|
||||
Yes, if you are using a provider with a model that support web browsing. Be mindful of the security implications of allowing this.
|
||||
|
||||
### Can Kilo Code run commands in my terminal?
|
||||
|
||||
Yes, Kilo Code can execute commands in your VS Code terminal. You will be prompted to approve each command before it's executed, unless you've enabled auto-approval for commands. Be extremely cautious about auto-approving commands. If you're experiencing issues with terminal commands, see the [Shell Integration Guide](/features/shell-integration) for troubleshooting.
|
||||
|
||||
### How do I provide feedback to Kilo Code?
|
||||
|
||||
You can provide feedback by approving or rejecting Kilo Code's proposed actions. You can provide additional feedback by using the feedback field.
|
||||
|
||||
### Can I customize Kilo Code's behavior?
|
||||
|
||||
Yes, you can customize Kilo Code in several ways:
|
||||
|
||||
- **Custom Instructions:** Provide general instructions that apply to all modes, or mode-specific instructions.
|
||||
- **Custom Modes:** Create your own modes with tailored prompts and tool permissions.
|
||||
- **`.clinerules` Files:** Create `.clinerules` files in your project to provide additional guidelines.
|
||||
- **Settings:** Adjust various settings, such as auto-approval, diff editing, and more.
|
||||
|
||||
### Does Kilo Code have any auto approval settings?
|
||||
|
||||
Yes, Kilo Code has a few settings that when enabled will automatically approve actions. Find out more [here](/features/auto-approving-actions).
|
||||
|
||||
## Advanced Features
|
||||
|
||||
### Can I use Kilo Code offline?
|
||||
|
||||
Yes, if you use a [local model](/advanced-usage/local-models).
|
||||
|
||||
### What is MCP (Model Context Protocol)?
|
||||
|
||||
[MCP](/features/mcp/overview) is a protocol that allows Kilo Code to communicate with external servers, extending its capabilities with custom tools and resources.
|
||||
|
||||
### Can I create my own MCP servers?
|
||||
|
||||
Yes, you can create your own MCP servers to add custom functionality to Kilo Code. See the [MCP documentation](https://github.com/modelcontextprotocol) for details.
|
||||
Yes, you can create your own MCP servers to add custom functionality to Kilo Code. See the [MCP documentation](https://github.com/modelcontextprotocol) for details.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Kilo Code isn't responding. What should I do?
|
||||
|
||||
- Make sure your API key is correct and hasn't expired.
|
||||
- Check your internet connection.
|
||||
- Check the status of your chosen API provider.
|
||||
- Try restarting VS Code.
|
||||
- If the problem persists, report the issue on [GitHub](https://github.com/Kilo-Org/kilocode/issues) or [Discord](https://kilocode.ai/discord).
|
||||
|
||||
### I'm seeing an error message. What does it mean?
|
||||
|
||||
The error message should provide some information about the problem. If you're unsure how to resolve it, seek help in the community forums.
|
||||
|
||||
### Kilo Code made changes I didn't want. How do I undo them?
|
||||
|
||||
Kilo Code uses VS Code's built-in file editing capabilities. You can use the standard "Undo" command (Ctrl/Cmd + Z) to revert changes. Also, if experimental checkpoints are enabled, Kilo can revert changes made to a file.
|
||||
|
||||
### How do I report a bug or suggest a feature?
|
||||
|
||||
Please report bugs or suggest features on the Kilo Code [Issues page](https://github.com/Kilo-Org/kilocode/issues) and [Feature Requests page](https://github.com/Kilo-Org/kilocode/discussions/categories/ideas).
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 39 KiB |
@@ -1,97 +0,0 @@
|
||||
# API Configuration Profiles
|
||||
|
||||
API Configuration Profiles allow you to create and switch between different sets of AI settings. Each profile can have different configurations for each mode, letting you optimize your experience based on the task at hand.
|
||||
|
||||
:::info
|
||||
Having multiple configuration profiles lets you quickly switch between different AI providers, models, and settings without reconfiguring everything each time you want to change your setup.
|
||||
:::
|
||||
## How It Works
|
||||
|
||||
Configuration profiles can have their own:
|
||||
- API providers (OpenAI, Anthropic, OpenRouter, Glama, etc.)
|
||||
- API keys and authentication details
|
||||
- Model selections (o3-mini-high, Claude 3.7 Sonnet, DeepSeek R1, etc.)
|
||||
- [Temperature settings](/features/model-temperature) for controlling response randomness
|
||||
- Thinking budgets
|
||||
- Provider-specific settings
|
||||
|
||||
Note that available settings vary by provider and model. Each provider offers different configuration options, and even within the same provider, different models may support different parameter ranges or features.
|
||||
|
||||
## Creating and Managing Profiles
|
||||
|
||||
### Creating a Profile
|
||||
|
||||
1. Open Settings by clicking the gear icon <Codicon name="gear" /> → Providers
|
||||
2. Click the "+" button next to the profile selector
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-1.png" alt="Profile selector with plus button" width="550" />
|
||||
3. Enter a name for your new profile
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles.png" alt="Creating a new profile dialog" width="550" />
|
||||
4. Configure the profile settings:
|
||||
- Select your API provider
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-2.png" alt="Provider selection dropdown" width="550" />
|
||||
- Enter API key
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-3.png" alt="API key entry field" width="550" />
|
||||
- Choose a model
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-8.png" alt="Model selection interface" width="550" />
|
||||
- Adjust model parameters
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-5.png" alt="Model parameter adjustment controls" width="550" />
|
||||
|
||||
### Switching Profiles
|
||||
|
||||
Switch profiles in two ways:
|
||||
1. From Settings panel: Select a different profile from the dropdown
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-7.png" alt="Profile selection dropdown in Settings" width="550" />
|
||||
2. During chat: Access the API Configuration dropdown in the chat interface
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-6.png" alt="API Configuration dropdown in chat interface" width="550" />
|
||||
### Pinning and Sorting Profiles
|
||||
|
||||
The API configuration dropdown now supports pinning your favorite profiles for quicker access:
|
||||
|
||||
1. Hover over any profile in the dropdown to reveal the pin icon
|
||||
2. Click the pin icon to add the profile to your pinned list
|
||||
3. Pinned profiles appear at the top of the dropdown, sorted alphabetically
|
||||
4. Unpinned profiles appear below a separator, also sorted alphabetically
|
||||
5. You can unpin a profile by clicking the same icon again
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-4.png" alt="Pinning API configuration profiles" width="550" />
|
||||
|
||||
This feature makes it easier to navigate between commonly used profiles, especially when you have many configurations.
|
||||
|
||||
|
||||
### Editing and Deleting Profiles
|
||||
|
||||
<img src="/docs/img/api-configuration-profiles/api-configuration-profiles-10.png" alt="Profile editing interface" width="550" />
|
||||
- Select the profile in Settings to modify any settings
|
||||
- Click the pencil icon to rename a profile
|
||||
- Click the trash icon to delete a profile (you cannot delete the only remaining profile)
|
||||
|
||||
## Linking Profiles to Modes
|
||||
In the <Codicon name="notebook" /> Prompts tab, you can explicitly associate a specific Configuration Profile with each Mode. The system also automatically remembers which profile you last used with each mode, making your workflow more efficient.
|
||||
|
||||
Watch this demonstration of how to connect configuration profiles with specific modes for optimized workflows:
|
||||
|
||||
<video width="600" controls>
|
||||
<source src="/docs/img/api-configuration-profiles/provider-modes.mp4" type="video/mp4" />
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
|
||||
|
||||
## Security Note
|
||||
|
||||
API keys are stored securely in VSCode's Secret Storage and are never exposed in plain text.
|
||||
|
||||
## Related Features
|
||||
|
||||
- Works with [custom modes](/features/custom-modes) you create
|
||||
- Integrates with [local models](/advanced-usage/local-models) for offline work
|
||||
- Supports [temperature settings](/features/model-temperature) per mode
|
||||
- Enhances cost management with [rate limits and usage tracking](/advanced-usage/rate-limits-costs)
|
||||
|
||||
@@ -1,295 +0,0 @@
|
||||
# Auto-Approving Actions
|
||||
|
||||
> ⚠️ **SECURITY WARNING:** Auto-approve settings bypass confirmation prompts, giving Kilo Code direct access to your system. This can result in **data loss, file corruption, or worse**. Command line access is particularly dangerous, as it can potentially execute harmful operations that could damage your system or compromise security. Only enable auto-approval for actions you fully trust.
|
||||
|
||||
Auto-approve settings speed up your workflow by eliminating repetitive confirmation prompts, but they significantly increase security risks.
|
||||
|
||||
## Quick Start Guide
|
||||
|
||||
1. Click the Auto-Approve Toolbar above the chat input
|
||||
2. Select which actions Kilo Code can perform without asking permission
|
||||
3. Use the master toggle (leftmost checkbox) to quickly enable/disable all permissions
|
||||
|
||||
[](https://youtube.com/shorts/NBccFnYDQ-k?feature=shared)
|
||||
|
||||
## Auto-Approve Toolbar
|
||||
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions.png" alt="Auto-approve toolbar collapsed state" width="600" />
|
||||
|
||||
_Prompt box and Auto-Approve Toolbar showing enabled permissions_
|
||||
|
||||
Click the toolbar to expand it and configure individual permissions:
|
||||
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-1.png" alt="Auto-approve toolbar expanded state" width="600" />
|
||||
|
||||
_Prompt text box and Expanded toolbar with all options_
|
||||
|
||||
### Available Permissions
|
||||
|
||||
| Permission | What it does | Risk level |
|
||||
| ------------------------------ | ------------------------------------------------ | ----------- |
|
||||
| **Read files and directories** | Lets Kilo Code access files without asking | Medium |
|
||||
| **Edit files** | Lets Kilo Code modify files without asking | **High** |
|
||||
| **Execute approved commands** | Runs whitelisted terminal commands automatically | **High** |
|
||||
| **Use the browser** | Allows headless browser interaction | Medium |
|
||||
| **Use MCP servers** | Lets Kilo Code use configured MCP services | Medium-High |
|
||||
| **Switch modes** | Changes between Kilo Code modes automatically | Low |
|
||||
| **Create & complete subtasks** | Manages subtasks without confirmation | Low |
|
||||
| **Retry failed requests** | Automatically retries failed API requests | Low |
|
||||
| **Answer follow-up questions** | Selects default answer for follow-up questions | Low |
|
||||
| **Update todo list** | Automatically updates task progress | Low |
|
||||
|
||||
## Master Toggle for Quick Control
|
||||
|
||||
The leftmost checkbox works as a master toggle:
|
||||
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-14.png" alt="Master toggle in Auto-approve toolbar" width="600" />
|
||||
|
||||
_Master toggle (checkbox) controls all auto-approve permissions at once_
|
||||
|
||||
Use the master toggle when:
|
||||
|
||||
- Working in sensitive code (turn off)
|
||||
- Doing rapid development (turn on)
|
||||
- Switching between exploration and editing tasks
|
||||
|
||||
## Advanced Settings Panel
|
||||
|
||||
The settings panel provides detailed control with important security context:
|
||||
|
||||
> **Allow Kilo Code to automatically perform operations without requiring approval. Enable these settings only if you fully trust the AI and understand the associated security risks.**
|
||||
|
||||
To access these settings:
|
||||
|
||||
1. Click <Codicon name="gear" /> in the top-right corner
|
||||
2. Navigate to Auto-Approve Settings
|
||||
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-4.png" alt="Settings panel auto-approve options" width="550" />
|
||||
|
||||
_Complete settings panel view_
|
||||
|
||||
### Read Operations
|
||||
|
||||
:::caution Read Operations
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-6.png" alt="Read-only operations setting" width="550" />
|
||||
|
||||
**Setting:** "Always approve read-only operations"
|
||||
|
||||
**Description:** "When enabled, Kilo Code will automatically view directory contents and read files without requiring you to click the Approve button."
|
||||
|
||||
**Risk level:** Medium
|
||||
|
||||
While this setting only allows reading files (not modifying them), it could potentially expose sensitive data. Still recommended as a starting point for most users, but be mindful of what files Kilo Code can access.
|
||||
:::
|
||||
|
||||
### Write Operations
|
||||
|
||||
:::caution Write Operations
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-7.png" alt="Write operations setting with delay slider" width="550" />
|
||||
|
||||
**Setting:** "Always approve write operations"
|
||||
|
||||
**Description:** "Automatically create and edit files without requiring approval"
|
||||
|
||||
**Delay slider:** "Delay after writes to allow diagnostics to detect potential problems" (Default: 1000ms)
|
||||
|
||||
**Risk level:** High
|
||||
|
||||
This setting allows Kilo Code to modify your files without confirmation. The delay timer is crucial:
|
||||
|
||||
- Higher values (2000ms+): Recommended for complex projects where diagnostics take longer
|
||||
- Default (1000ms): Suitable for most projects
|
||||
- Lower values: Use only when speed is critical and you're in a controlled environment
|
||||
- Zero: No delay for diagnostics (not recommended for critical code)
|
||||
|
||||
#### Write Delay & Problems Pane Integration
|
||||
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-5.png" alt="VSCode Problems pane showing diagnostic information" width="600" />
|
||||
|
||||
_VSCode Problems pane that Kilo Code checks during the write delay_
|
||||
|
||||
When you enable auto-approval for writing files, the delay timer works with VSCode's Problems pane:
|
||||
|
||||
1. Kilo Code makes a change to your file
|
||||
2. VSCode's diagnostic tools analyze the change
|
||||
3. The Problems pane updates with any errors or warnings
|
||||
4. Kilo Code notices these issues before continuing
|
||||
|
||||
This works like a human developer pausing to check for errors after changing code. You can adjust the delay time based on:
|
||||
|
||||
- Project complexity
|
||||
- Language server speed
|
||||
- How important error detection is for your workflow
|
||||
:::
|
||||
|
||||
### Browser Actions
|
||||
|
||||
:::info Browser Actions
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-8.png" alt="Browser actions setting" width="550" />
|
||||
|
||||
**Setting:** "Always approve browser actions"
|
||||
|
||||
**Description:** "Automatically perform browser actions without requiring approval"
|
||||
|
||||
**Note:** "Only applies when the model supports computer use"
|
||||
|
||||
**Risk level:** Medium
|
||||
|
||||
Allows Kilo Code to control a headless browser without confirmation. This can include:
|
||||
|
||||
- Opening websites
|
||||
- Navigating pages
|
||||
- Interacting with web elements
|
||||
|
||||
Consider the security implications of allowing automated browser access.
|
||||
:::
|
||||
|
||||
### API Requests
|
||||
|
||||
:::info API Requests
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-9.png" alt="API requests retry setting with delay slider" width="550" />
|
||||
|
||||
**Setting:** "Always retry failed API requests"
|
||||
|
||||
**Description:** "Automatically retry failed API requests when server returns an error response"
|
||||
|
||||
**Delay slider:** "Delay before retrying the request" (Default: 5s)
|
||||
|
||||
**Risk level:** Low
|
||||
|
||||
This setting automatically retries API calls when they fail. The delay controls how long Kilo Code waits before trying again:
|
||||
|
||||
- Longer delays are gentler on API rate limits
|
||||
- Shorter delays give faster recovery from transient errors
|
||||
:::
|
||||
|
||||
### MCP Tools
|
||||
|
||||
:::caution MCP Tools
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-10.png" alt="MCP tools setting" width="550" />
|
||||
|
||||
**Setting:** "Always approve MCP tools"
|
||||
|
||||
**Description:** "Enable auto-approval of individual MCP tools in the MCP Servers view (requires both this setting and the tool's individual 'Always allow' checkbox)"
|
||||
|
||||
**Risk level:** Medium-High (depends on configured MCP tools)
|
||||
|
||||
This setting works in conjunction with individual tool permissions in the MCP Servers view. Both this global setting and the tool-specific permission must be enabled for auto-approval.
|
||||
:::
|
||||
|
||||
### Mode Switching
|
||||
|
||||
:::info Mode Switching
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-11.png" alt="Mode switching setting" width="550" />
|
||||
|
||||
**Setting:** "Always approve mode switching"
|
||||
|
||||
**Description:** "Automatically switch between different modes without requiring approval"
|
||||
|
||||
**Risk level:** Low
|
||||
|
||||
Allows Kilo Code to change between different modes (Code, Architect, etc.) without asking for permission. This primarily affects the AI's behavior rather than system access.
|
||||
:::
|
||||
|
||||
### Subtasks
|
||||
|
||||
:::info Subtasks
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-12.png" alt="Subtasks setting" width="550" />
|
||||
|
||||
**Setting:** "Always approve creation & completion of subtasks"
|
||||
|
||||
**Description:** "Allow creation and completion of subtasks without requiring approval"
|
||||
|
||||
**Risk level:** Low
|
||||
|
||||
Enables Kilo Code to create and complete subtasks automatically. This relates to workflow organization rather than system access.
|
||||
:::
|
||||
|
||||
### Command Execution
|
||||
|
||||
:::caution Command Execution
|
||||
<img src="/docs/img/auto-approving-actions/auto-approving-actions-13.png" alt="Command execution setting with whitelist interface" width="550" />
|
||||
|
||||
**Setting:** "Always approve allowed execute operations"
|
||||
|
||||
**Description:** "Automatically execute allowed terminal commands without requiring approval"
|
||||
|
||||
**Command management:** "Command prefixes that can be auto-executed when 'Always approve execute operations' is enabled. Add \* to allow all commands (use with caution)."
|
||||
|
||||
**Risk level:** High
|
||||
|
||||
This setting allows terminal command execution with controls. While risky, the whitelist feature limits what commands can run. Important security features:
|
||||
|
||||
- Whitelist specific command prefixes (recommended)
|
||||
- Never use \* wildcard in production or with sensitive data
|
||||
- Consider security implications of each allowed command
|
||||
- Always verify commands that interact with external systems
|
||||
|
||||
**Interface elements:**
|
||||
|
||||
- Text field to enter command prefixes (e.g., 'git')
|
||||
- "Add" button to add new prefixes
|
||||
- Clickable command buttons with X to remove them
|
||||
:::
|
||||
|
||||
### Follow-Up Questions
|
||||
|
||||
:::info Follow-Up Questions (Risk: Low)
|
||||
|
||||
**Setting:** `Always default answer for follow-up questions`
|
||||
|
||||
**Description:** Automatically selects the first AI-suggested answer for a follow-up question after a configurable timeout. This speeds up your workflow by letting Kilo Code proceed without manual intervention.
|
||||
|
||||
**Visual countdown:** When enabled, a countdown timer appears on the first suggestion button, showing the remaining time before auto-selection. The timer is displayed as a circular progress indicator that depletes as time passes.
|
||||
|
||||
**Timeout slider:** Use the slider to set the wait time from 1 to 300 seconds (Default: 60s).
|
||||
|
||||
**Override options:** You can cancel the auto-selection at any time by:
|
||||
|
||||
- Clicking a different suggestion
|
||||
- Editing any suggestion
|
||||
- Typing your own response
|
||||
- Clicking the timer to pause it
|
||||
|
||||
**Risk level:** Low
|
||||
|
||||
**Use cases:**
|
||||
|
||||
- Overnight runs where you want Kilo Code to continue working
|
||||
- Repetitive tasks where the default suggestions are usually correct
|
||||
- Testing workflows where interaction isn't critical
|
||||
:::
|
||||
|
||||
### Update Todo List
|
||||
|
||||
:::info Update Todo List (Risk: Low)
|
||||
|
||||
**Setting:** "Always approve todo list updates"
|
||||
|
||||
**Description:** "Automatically update the to-do list without requiring approval"
|
||||
|
||||
**Risk level:** Low
|
||||
|
||||
This setting allows Kilo Code to automatically update task progress and todo lists during work sessions. This includes:
|
||||
|
||||
- Marking tasks as completed
|
||||
- Adding new discovered tasks
|
||||
- Updating task status (pending, in progress, completed)
|
||||
- Reorganizing task priorities
|
||||
|
||||
**Benefits:**
|
||||
|
||||
- Maintains real-time task progress visibility
|
||||
- Reduces interruptions during multi-step workflows
|
||||
- Keeps project status accurately reflected
|
||||
- Helps track complex task dependencies
|
||||
|
||||
**Use cases:**
|
||||
|
||||
- Long-running development sessions
|
||||
- Multi-step refactoring projects
|
||||
- Complex debugging workflows
|
||||
- Feature implementation with many subtasks
|
||||
|
||||
This is particularly useful when combined with the Subtasks permission, as it allows Kilo Code to maintain a complete picture of project progress without constant approval requests.
|
||||
:::
|
||||
@@ -1,165 +0,0 @@
|
||||
# Browser Use
|
||||
|
||||
Kilo Code provides sophisticated browser automation capabilities that let you interact with websites directly from VS Code. This feature enables testing web applications, automating browser tasks, and capturing screenshots without leaving your development environment.
|
||||
|
||||
:::info Model Support Required
|
||||
Browser Use within Kilo Code requires the use and advanced agentic model, and has only been tested with Claude Sonnet 3.5, 3.7, and 4
|
||||
:::
|
||||
|
||||
## How Browser Use Works
|
||||
|
||||
By default, Kilo Code uses a built-in browser that:
|
||||
- Launches automatically when you ask Kilo to visit a website
|
||||
- Captures screenshots of web pages
|
||||
- Allows Kilo to interact with web elements
|
||||
- Runs invisibly in the background
|
||||
|
||||
All of this happens directly within VS Code, with no setup required.
|
||||
|
||||
## Using Browser Use
|
||||
|
||||
A typical browser interaction follows this pattern:
|
||||
|
||||
1. Ask Kilo to visit a website
|
||||
2. Kilo launches the browser and shows you a screenshot
|
||||
3. Request additional actions (clicking, typing, scrolling)
|
||||
4. Kilo closes the browser when finished
|
||||
|
||||
For example:
|
||||
|
||||
```
|
||||
Open the browser and view our site.
|
||||
```
|
||||
|
||||
```
|
||||
Can you check if my website at https://kilocode.ai is displaying correctly?
|
||||
```
|
||||
|
||||
```
|
||||
Browse http://localhost:3000, scroll down to the bottom of the page and check if the footer information is displaying correctly.
|
||||
```
|
||||
|
||||
<img src="/docs/features/KiloCodeBrowser.png" alt="Browser use example" width="300" />
|
||||
|
||||
## How Browser Actions Work
|
||||
|
||||
The browser_action tool controls a browser instance that returns screenshots and console logs after each action, allowing you to see the results of interactions.
|
||||
|
||||
Key characteristics:
|
||||
- Each browser session must start with `launch` and end with `close`
|
||||
- Only one browser action can be used per message
|
||||
- While the browser is active, no other tools can be used
|
||||
- You must wait for the response (screenshot and logs) before performing the next action
|
||||
|
||||
### Available Browser Actions
|
||||
|
||||
| Action | Description | When to Use |
|
||||
|--------|-------------|------------|
|
||||
| `launch` | Opens a browser at a URL | Starting a new browser session |
|
||||
| `click` | Clicks at specific coordinates | Interacting with buttons, links, etc. |
|
||||
| `type` | Types text into active element | Filling forms, search boxes |
|
||||
| `scroll_down` | Scrolls down by one page | Viewing content below the fold |
|
||||
| `scroll_up` | Scrolls up by one page | Returning to previous content |
|
||||
| `close` | Closes the browser | Ending a browser session |
|
||||
|
||||
## Browser Use Configuration/Settings
|
||||
|
||||
:::info Default Browser Settings
|
||||
- **Enable browser tool**: Enabled
|
||||
- **Viewport size**: Small Desktop (900x600)
|
||||
- **Screenshot quality**: 75%
|
||||
- **Use remote browser connection**: Disabled
|
||||
:::
|
||||
|
||||
### Accessing Settings
|
||||
|
||||
To change Browser / Computer Use settings in Kilo:
|
||||
|
||||
1. Open Settings by clicking the gear icon <Codicon name="gear" /> → Browser / Computer Use
|
||||
|
||||
<img src="/docs/img/browser-use/browser-use.png" alt="Browser settings menu" width="600" />
|
||||
|
||||
### Enable/Disable Browser Use
|
||||
|
||||
**Purpose**: Master toggle that enables Kilo to interact with websites using a Puppeteer-controlled browser.
|
||||
|
||||
To change this setting:
|
||||
1. Check or uncheck the "Enable browser tool" checkbox within your Browser / Computer Use settings
|
||||
|
||||
<img src="/docs/img/browser-use/browser-use-2.png" alt="Enable browser tool setting" width="300" />
|
||||
|
||||
### Viewport Size
|
||||
|
||||
**Purpose**: Determines the resolution of the browser session Kilo Code uses.
|
||||
|
||||
**Tradeoff**: Higher values provide a larger viewport but increase token usage.
|
||||
|
||||
To change this setting:
|
||||
1. Click the dropdown menu under "Viewport size" within your Browser / Computer Use settings
|
||||
2. Select one of the available options:
|
||||
- Large Desktop (1280x800)
|
||||
- Small Desktop (900x600) - Default
|
||||
- Tablet (768x1024)
|
||||
- Mobile (360x640)
|
||||
2. Select your desired resolution.
|
||||
|
||||
<img src="/docs/img/browser-use/browser-use-3.png" alt="Viewport size setting" width="600" />
|
||||
|
||||
### Screenshot Quality
|
||||
|
||||
**Purpose**: Controls the WebP compression quality of browser screenshots.
|
||||
|
||||
**Tradeoff**: Higher values provide clearer screenshots but increase token usage.
|
||||
|
||||
To change this setting:
|
||||
1. Adjust the slider under "Screenshot quality" within your Browser / Computer Use settings
|
||||
2. Set a value between 1-100% (default is 75%)
|
||||
3. Higher values provide clearer screenshots but increase token usage:
|
||||
- 40-50%: Good for basic text-based websites
|
||||
- 60-70%: Balanced for most general browsing
|
||||
- 80%+: Use when fine visual details are critical
|
||||
|
||||
<img src="/docs/img/browser-use/browser-use-4.png" alt="Screenshot quality setting" width="600" />
|
||||
|
||||
### Remote Browser Connection
|
||||
|
||||
**Purpose**: Connect Kilo to an existing Chrome browser instead of using the built-in browser.
|
||||
|
||||
**Benefits**:
|
||||
- Works in containerized environments and remote development workflows
|
||||
- Maintains authenticated sessions between browser uses
|
||||
- Eliminates repetitive login steps
|
||||
- Allows use of custom browser profiles with specific extensions
|
||||
|
||||
**Requirements**: Chrome must be running with remote debugging enabled.
|
||||
|
||||
To enable this feature:
|
||||
1. Check the "Use remote browser connection" box in Browser / Computer Use settings
|
||||
2. Click "Test Connection" to verify
|
||||
|
||||
<img src="/docs/img/browser-use/browser-use-5.png" alt="Remote browser connection setting" width="600" />
|
||||
|
||||
#### Common Use Cases
|
||||
|
||||
- **DevContainers**: Connect from containerized VS Code to host Chrome browser
|
||||
- **Remote Development**: Use local Chrome with remote VS Code server
|
||||
- **Custom Chrome Profiles**: Use profiles with specific extensions and settings
|
||||
|
||||
#### Connecting to a Visible Chrome Window
|
||||
|
||||
Connect to a visible Chrome window to observe Kilo's interactions in real-time:
|
||||
|
||||
**macOS**
|
||||
```bash
|
||||
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug --no-first-run
|
||||
```
|
||||
|
||||
**Windows**
|
||||
```bash
|
||||
"C:\Program Files\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222 --user-data-dir=C:\chrome-debug --no-first-run
|
||||
```
|
||||
|
||||
**Linux**
|
||||
```bash
|
||||
google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug --no-first-run
|
||||
```
|
||||
@@ -1,236 +0,0 @@
|
||||
# Checkpoints
|
||||
|
||||
Checkpoints automatically version your workspace files during Kilo Code tasks, enabling non-destructive exploration of AI suggestions and easy recovery from unwanted changes.
|
||||
|
||||
Checkpoints let you:
|
||||
- Safely experiment with AI-suggested changes
|
||||
- Easily recover from undesired modifications
|
||||
- Compare different implementation approaches
|
||||
- Revert to previous project states without losing work
|
||||
|
||||
:::info Important Notes
|
||||
- **Checkpoints are enabled by default.**
|
||||
- **Git must be installed** for checkpoints to function - [see installation instructions](#git-installation)
|
||||
- No GitHub account or repository is required
|
||||
- No Git personal information configuration is needed
|
||||
- The shadow Git repository operates independently from your project's existing Git configuration
|
||||
:::
|
||||
|
||||
## Configuration Options
|
||||
|
||||
Access checkpoint settings in Kilo Code settings under the "Checkpoints" section:
|
||||
|
||||
1. Open Settings by clicking the gear icon <Codicon name="gear" /> → Checkpoints
|
||||
2. Check or uncheck the "Enable automatic checkpoints" checkbox
|
||||
|
||||
<img src="/docs/img/checkpoints/checkpoints.png" alt="Checkpoint settings in Kilo Code configuration" width="500" />
|
||||
|
||||
## How Checkpoints Work
|
||||
|
||||
Kilo Code captures snapshots of your project's state using a shadow Git repository, separate from your main version control system. These snapshots, called checkpoints, automatically record changes throughout your AI-assisted workflow—whenever tasks begin, files change, or commands run.
|
||||
|
||||
Checkpoints are stored as Git commits in the shadow repository, capturing:
|
||||
|
||||
- File content changes
|
||||
- New files added
|
||||
- Deleted files
|
||||
- Renamed files
|
||||
- Binary file changes
|
||||
|
||||
## Working with Checkpoints
|
||||
|
||||
Checkpoints are integrated directly into your workflow through the chat interface.
|
||||
|
||||
Checkpoints appear directly in your chat history in two forms:
|
||||
|
||||
- **Initial checkpoint** marks your starting project state
|
||||
<img src="/docs/img/checkpoints/checkpoints-1.png" alt="Initial checkpoint indicator in chat" width="500" />
|
||||
|
||||
- **Regular checkpoints** appear after file modifications or command execution
|
||||
<img src="/docs/img/checkpoints/checkpoints-2.png" alt="Regular checkpoint indicator in chat" width="500" />
|
||||
|
||||
Each checkpoint provides two primary functions:
|
||||
|
||||
### Viewing Differences
|
||||
|
||||
To compare your current workspace with a previous checkpoint:
|
||||
|
||||
1. Locate the checkpoint in your chat history
|
||||
2. Click the checkpoint's `View Differences` button
|
||||
|
||||
<img src="/docs/img/checkpoints/checkpoints-6.png" alt="View Differences button interface" width="100" />
|
||||
|
||||
3. Review the differences in the comparison view:
|
||||
- Added lines are highlighted in green
|
||||
- Removed lines are highlighted in red
|
||||
- Modified files are listed with detailed changes
|
||||
- Renamed and moved files are tracked with their path changes
|
||||
- New or deleted files are clearly marked
|
||||
|
||||
<img src="/docs/img/checkpoints/checkpoints-3.png" alt="View differences option for checkpoints" width="800" />
|
||||
|
||||
### Restoring Checkpoints
|
||||
|
||||
To restore a project to a previous checkpoint state:
|
||||
|
||||
1. Locate the checkpoint in your chat history
|
||||
2. Click the checkpoint's `Restore Checkpoint` button
|
||||
<img src="/docs/img/checkpoints/checkpoints-7.png" alt="Restore checkpoint button interface" width="100" />
|
||||
3. Choose one of these restoration options:
|
||||
|
||||
<img src="/docs/img/checkpoints/checkpoints-4.png" alt="Restore checkpoint option" width="300" />
|
||||
|
||||
- **Restore Files Only** - Reverts only workspace files to checkpoint state without modifying conversation history. Ideal for comparing alternative implementations while maintaining chat context, allowing you to seamlessly switch between different project states. This option does not require confirmation and lets you quickly switch between different implementations.
|
||||
|
||||
- **Restore Files & Task** - Reverts both workspace files AND removes all subsequent conversation messages. Use when you want to completely reset both your code and conversation back to the checkpoint's point in time. This option requires confirmation in a dialog as it cannot be undone.
|
||||
|
||||
<img src="/docs/img/checkpoints/checkpoints-9.png" alt="Confirmation dialog for restoring checkpoint with files & task" width="300" />
|
||||
|
||||
### Limitations and Considerations
|
||||
|
||||
- **Scope**: Checkpoints only capture changes made during active Kilo Code tasks
|
||||
- **External changes**: Modifications made outside of tasks (manual edits, other tools) aren't included
|
||||
- **Large files**: Very large binary files may impact performance
|
||||
- **Unsaved work**: Restoration will overwrite any unsaved changes in your workspace
|
||||
|
||||
## Technical Implementation
|
||||
|
||||
### Checkpoint Architecture
|
||||
|
||||
The checkpoint system consists of:
|
||||
|
||||
1. **Shadow Git Repository**: A separate Git repository created specifically for checkpoint tracking that functions as the persistent storage mechanism for checkpoint state.
|
||||
|
||||
2. **Checkpoint Service**: Handles Git operations and state management through:
|
||||
- Repository initialization
|
||||
- Checkpoint creation and storage
|
||||
- Diff computation
|
||||
- State restoration
|
||||
|
||||
3. **UI Components**: Interface elements displayed in the chat that enable interaction with checkpoints.
|
||||
|
||||
### Restoration Process
|
||||
|
||||
When restoration executes, Kilo Code:
|
||||
- Performs a hard reset to the specified checkpoint commit
|
||||
- Copies all files from the shadow repository to your workspace
|
||||
- Updates internal checkpoint tracking state
|
||||
|
||||
### Storage Type
|
||||
|
||||
Checkpoints are task-scoped, meaning they are specific to a single task.
|
||||
|
||||
### Diff Computation
|
||||
|
||||
Checkpoint comparison uses Git's underlying diff capabilities to produce structured file differences:
|
||||
- Modified files show line-by-line changes
|
||||
- Binary files are properly detected and handled
|
||||
- Renamed and moved files are tracked correctly
|
||||
- File creation and deletion are clearly identified
|
||||
|
||||
### File Exclusion and Ignore Patterns
|
||||
|
||||
The checkpoint system uses intelligent file exclusion to track only relevant files:
|
||||
|
||||
#### Built-in Exclusions
|
||||
|
||||
The system has comprehensive built-in exclusion patterns that automatically ignore:
|
||||
- Build artifacts and dependency directories (`node_modules/`, `dist/`, `build/`)
|
||||
- Media files and binary assets (images, videos, audio)
|
||||
- Cache and temporary files (`.cache/`, `.tmp/`, `.bak`)
|
||||
- Configuration files with sensitive information (`.env`)
|
||||
- Large data files (archives, executables, binaries)
|
||||
- Database files and logs
|
||||
|
||||
These patterns are written to the shadow repository's `.git/info/exclude` file during initialization.
|
||||
|
||||
#### .gitignore Support
|
||||
|
||||
The checkpoint system respects `.gitignore` patterns in your workspace:
|
||||
- Files excluded by `.gitignore` won't trigger checkpoint creation
|
||||
- Excluded files won't appear in checkpoint diffs
|
||||
- Standard Git ignore rules apply when staging file changes
|
||||
|
||||
#### .kilocodeignore Behavior
|
||||
|
||||
The `.kilocodeignore` file (which controls AI access to files) is separate from checkpoint tracking:
|
||||
- Files excluded by `.kilocodeignore` but not by `.gitignore` will still be checkpointed
|
||||
- Changes to AI-inaccessible files can still be restored through checkpoints
|
||||
|
||||
This separation is intentional, as `.kilocodeignore` limits which files the AI can access, not which files should be tracked for version history.
|
||||
|
||||
#### Nested Git Repositories
|
||||
|
||||
The checkpoint system includes special handling for nested Git repositories:
|
||||
- Temporarily renames nested `.git` directories to `.git_disabled` during operations
|
||||
- Restores them after operations complete
|
||||
- Allows proper tracking of files in nested repositories
|
||||
- Ensures nested repositories remain functional and unaffected
|
||||
|
||||
### Concurrency Control
|
||||
|
||||
Operations are queued to prevent concurrent Git operations that might corrupt repository state. This ensures that rapid checkpoint operations complete safely even when requested in quick succession.
|
||||
|
||||
## Git Installation
|
||||
|
||||
Checkpoints require Git to be installed on your system. The implementation uses the `simple-git` library, which relies on Git command-line tools to create and manage shadow repositories.
|
||||
|
||||
### macOS
|
||||
|
||||
1. **Install with Homebrew (recommended)**:
|
||||
```
|
||||
brew install git
|
||||
```
|
||||
|
||||
2. **Alternative: Install with Xcode Command Line Tools**:
|
||||
```
|
||||
xcode-select --install
|
||||
```
|
||||
|
||||
3. **Verify installation**:
|
||||
- Open Terminal
|
||||
- Type `git --version`
|
||||
- You should see a version number like `git version 2.40.0`
|
||||
|
||||
### Windows
|
||||
|
||||
1. **Download Git for Windows**:
|
||||
- Visit https://git-scm.com/download/win
|
||||
- The download should start automatically
|
||||
|
||||
2. **Run the installer**:
|
||||
- Accept the license agreement
|
||||
- Choose installation location (default is recommended)
|
||||
- Select components (default options are typically sufficient)
|
||||
- Choose the default editor
|
||||
- Choose how to use Git from the command line (recommended: Git from the command line and also from 3rd-party software)
|
||||
- Configure line ending conversions (recommended: Checkout Windows-style, commit Unix-style)
|
||||
- Complete the installation
|
||||
|
||||
3. **Verify installation**:
|
||||
- Open Command Prompt or PowerShell
|
||||
- Type `git --version`
|
||||
- You should see a version number like `git version 2.40.0.windows.1`
|
||||
|
||||
### Linux
|
||||
|
||||
**Debian/Ubuntu**:
|
||||
```
|
||||
sudo apt update
|
||||
sudo apt install git
|
||||
```
|
||||
|
||||
**Fedora**:
|
||||
```
|
||||
sudo dnf install git
|
||||
```
|
||||
|
||||
**Arch Linux**:
|
||||
```
|
||||
sudo pacman -S git
|
||||
```
|
||||
|
||||
**Verify installation**:
|
||||
- Open Terminal
|
||||
- Type `git --version`
|
||||
- You should see a version number
|
||||
@@ -1,234 +0,0 @@
|
||||
import Codicon from '@site/src/components/Codicon';
|
||||
|
||||
# Codebase Indexing
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://www.youtube.com/watch?v=dj59Vi83oDw"
|
||||
/>
|
||||
|
||||
Codebase Indexing enables semantic code search across your entire project using AI embeddings. Instead of searching for exact text matches, it understands the _meaning_ of your queries, helping Kilo Code find relevant code even when you don't know specific function names or file locations.
|
||||
|
||||
<img src="/docs/img/codebase-indexing/codebase-indexing.png" alt="Codebase Indexing Settings" width="800" />
|
||||
|
||||
## What It Does
|
||||
|
||||
When enabled, the indexing system:
|
||||
|
||||
1. **Parses your code** using Tree-sitter to identify semantic blocks (functions, classes, methods)
|
||||
2. **Creates embeddings** of each code block using AI models
|
||||
3. **Stores vectors** in a Qdrant database for fast similarity search
|
||||
4. **Provides the [`codebase_search`](/advanced-usage/available-tools/codebase-search) tool** to Kilo Code for intelligent code discovery
|
||||
|
||||
This enables natural language queries like "user authentication logic" or "database connection handling" to find relevant code across your entire project.
|
||||
|
||||
## Key Benefits
|
||||
|
||||
- **Semantic Search**: Find code by meaning, not just keywords
|
||||
- **Enhanced AI Understanding**: Kilo Code can better comprehend and work with your codebase
|
||||
- **Cross-Project Discovery**: Search across all files, not just what's open
|
||||
- **Pattern Recognition**: Locate similar implementations and code patterns
|
||||
|
||||
## Setup Requirements
|
||||
|
||||
### Embedding Provider
|
||||
|
||||
Choose one of these options for generating embeddings:
|
||||
|
||||
**OpenAI (Recommended)**
|
||||
|
||||
- Requires OpenAI API key
|
||||
- Supports all OpenAI embedding models
|
||||
- Default: `text-embedding-3-small`
|
||||
- Processes up to 100,000 tokens per batch
|
||||
|
||||
**Gemini**
|
||||
|
||||
- Requires Google AI API key
|
||||
- Supports Gemini embedding models including `gemini-embedding-001`
|
||||
- Cost-effective alternative to OpenAI
|
||||
- High-quality embeddings for code understanding
|
||||
|
||||
**Ollama (Local)**
|
||||
|
||||
- Requires local Ollama installation
|
||||
- No API costs or internet dependency
|
||||
- Supports any Ollama-compatible embedding model
|
||||
- Requires Ollama base URL configuration
|
||||
|
||||
### Vector Database
|
||||
|
||||
**Qdrant** is required for storing and searching embeddings:
|
||||
|
||||
- **Local**: `http://localhost:6333` (recommended for testing)
|
||||
- **Cloud**: Qdrant Cloud or self-hosted instance
|
||||
- **Authentication**: Optional API key for secured deployments
|
||||
|
||||
## Setting Up Qdrant
|
||||
|
||||
### Quick Local Setup
|
||||
|
||||
**Using Docker:**
|
||||
|
||||
```bash
|
||||
docker run -p 6333:6333 qdrant/qdrant
|
||||
```
|
||||
|
||||
**Using Docker Compose:**
|
||||
|
||||
```yaml
|
||||
version: '3.8'
|
||||
services:
|
||||
qdrant:
|
||||
image: qdrant/qdrant
|
||||
ports:
|
||||
- '6333:6333'
|
||||
volumes:
|
||||
- qdrant_storage:/qdrant/storage
|
||||
volumes:
|
||||
qdrant_storage:
|
||||
```
|
||||
|
||||
### Production Deployment
|
||||
|
||||
For team or production use:
|
||||
|
||||
- [Qdrant Cloud](https://cloud.qdrant.io/) - Managed service
|
||||
- Self-hosted on AWS, GCP, or Azure
|
||||
- Local server with network access for team sharing
|
||||
|
||||
## Configuration
|
||||
|
||||
1. Open Kilo Code settings (<Codicon name="gear" /> icon)
|
||||
2. Navigate to **Codebase Indexing** section
|
||||
3. Enable **"Enable Codebase Indexing"** using the toggle switch
|
||||
4. Configure your embedding provider:
|
||||
- **OpenAI**: Enter API key and select model
|
||||
- **Gemini**: Enter Google AI API key and select embedding model
|
||||
- **Ollama**: Enter base URL and select model
|
||||
5. Set Qdrant URL and optional API key
|
||||
6. Configure **Max Search Results** (default: 20, range: 1-100)
|
||||
7. Click **Save** to start initial indexing
|
||||
|
||||
### Enable/Disable Toggle
|
||||
|
||||
The codebase indexing feature includes a convenient toggle switch that allows you to:
|
||||
|
||||
- **Enable**: Start indexing your codebase and make the search tool available
|
||||
- **Disable**: Stop indexing, pause file watching, and disable the search functionality
|
||||
- **Preserve Settings**: Your configuration remains saved when toggling off
|
||||
|
||||
This toggle is useful for temporarily disabling indexing during intensive development work or when working with sensitive codebases.
|
||||
|
||||
## Understanding Index Status
|
||||
|
||||
The interface shows real-time status with color indicators:
|
||||
|
||||
- **Standby** (Gray): Not running, awaiting configuration
|
||||
- **Indexing** (Yellow): Currently processing files
|
||||
- **Indexed** (Green): Up-to-date and ready for searches
|
||||
- **Error** (Red): Failed state requiring attention
|
||||
|
||||
## How Files Are Processed
|
||||
|
||||
### Smart Code Parsing
|
||||
|
||||
- **Tree-sitter Integration**: Uses AST parsing to identify semantic code blocks
|
||||
- **Language Support**: All languages supported by Tree-sitter
|
||||
- **Markdown Support**: Full support for markdown files and documentation
|
||||
- **Fallback**: Line-based chunking for unsupported file types
|
||||
- **Block Sizing**:
|
||||
- Minimum: 100 characters
|
||||
- Maximum: 1,000 characters
|
||||
- Splits large functions intelligently
|
||||
|
||||
### Automatic File Filtering
|
||||
|
||||
The indexer automatically excludes:
|
||||
|
||||
- Binary files and images
|
||||
- Large files (>1MB)
|
||||
- Git repositories (`.git` folders)
|
||||
- Dependencies (`node_modules`, `vendor`, etc.)
|
||||
- Files matching `.gitignore` and `.kilocode` patterns
|
||||
|
||||
### Incremental Updates
|
||||
|
||||
- **File Watching**: Monitors workspace for changes
|
||||
- **Smart Updates**: Only reprocesses modified files
|
||||
- **Hash-based Caching**: Avoids reprocessing unchanged content
|
||||
- **Branch Switching**: Automatically handles Git branch changes
|
||||
|
||||
## Best Practices
|
||||
|
||||
### Model Selection
|
||||
|
||||
**For OpenAI:**
|
||||
|
||||
- **`text-embedding-3-small`**: Best balance of performance and cost
|
||||
- **`text-embedding-3-large`**: Higher accuracy, 5x more expensive
|
||||
- **`text-embedding-ada-002`**: Legacy model, lower cost
|
||||
|
||||
**For Ollama:**
|
||||
|
||||
- **`mxbai-embed-large`**: The largest and highest-quality embedding model.
|
||||
- **`nomic-embed-text`**: Best balance of performance and embedding quality.
|
||||
- **`all-minilm`**: Compact model with lower quality but faster performance.
|
||||
|
||||
### Security Considerations
|
||||
|
||||
- **API Keys**: Stored securely in VS Code's encrypted storage
|
||||
- **Code Privacy**: Only small code snippets sent for embedding (not full files)
|
||||
- **Local Processing**: All parsing happens locally
|
||||
- **Qdrant Security**: Use authentication for production deployments
|
||||
|
||||
## Current Limitations
|
||||
|
||||
- **File Size**: 1MB maximum per file
|
||||
- **Single Workspace**: One workspace at a time
|
||||
- **Dependencies**: Requires external services (embedding provider + Qdrant)
|
||||
- **Language Coverage**: Limited to Tree-sitter supported languages for optimal parsing
|
||||
|
||||
## Using the Search Feature
|
||||
|
||||
Once indexed, Kilo Code can use the [`codebase_search`](/advanced-usage/available-tools/codebase-search) tool to find relevant code:
|
||||
|
||||
**Example Queries:**
|
||||
|
||||
- "How is user authentication handled?"
|
||||
- "Database connection setup"
|
||||
- "Error handling patterns"
|
||||
- "API endpoint definitions"
|
||||
|
||||
The tool provides Kilo Code with:
|
||||
|
||||
- Relevant code snippets (up to your configured max results limit)
|
||||
- File paths and line numbers
|
||||
- Similarity scores
|
||||
- Contextual information
|
||||
|
||||
### Search Results Configuration
|
||||
|
||||
You can control the number of search results returned by adjusting the **Max Search Results** setting:
|
||||
|
||||
- **Default**: 20 results
|
||||
- **Range**: 1-100 results
|
||||
- **Performance**: Lower values improve response speed
|
||||
- **Comprehensiveness**: Higher values provide more context but may slow responses
|
||||
|
||||
## Privacy & Security
|
||||
|
||||
- **Code stays local**: Only small code snippets sent for embedding
|
||||
- **Embeddings are numeric**: Not human-readable representations
|
||||
- **Secure storage**: API keys encrypted in VS Code storage
|
||||
- **Local option**: Use Ollama for completely local processing
|
||||
- **Access control**: Respects existing file permissions
|
||||
|
||||
## Future Enhancements
|
||||
|
||||
Planned improvements:
|
||||
|
||||
- Additional embedding providers
|
||||
- Multi-workspace indexing
|
||||
- Enhanced filtering and configuration options
|
||||
- Team sharing capabilities
|
||||
- Integration with VS Code's native search
|
||||
@@ -1,497 +0,0 @@
|
||||
# Custom Modes
|
||||
|
||||
Kilo Code allows you to create **custom modes** to tailor Kilo's behavior to specific tasks or workflows. Custom modes can be either **global** (available across all projects) or **project-specific** (defined within a single project).
|
||||
|
||||
## Sticky Models for Efficient Workflow
|
||||
|
||||
Each mode—including custom ones—features **Sticky Models**. This means Kilo Code automatically remembers and selects the last model you used with a particular mode. This lets you assign different preferred models to different tasks without constant reconfiguration, as Kilo switches between models when you change modes.
|
||||
|
||||
## Why Use Custom Modes?
|
||||
|
||||
- **Specialization:** Create modes optimized for specific tasks, like "Documentation Writer," "Test Engineer," or "Refactoring Expert"
|
||||
- **Safety:** Restrict a mode's access to sensitive files or commands. For example, a "Review Mode" could be limited to read-only operations
|
||||
- **Experimentation:** Safely experiment with different prompts and configurations without affecting other modes
|
||||
- **Team Collaboration:** Share custom modes with your team to standardize workflows
|
||||
|
||||
<img src="/img/custom-modes/custom-modes.png" alt="Overview of custom modes interface" width="600" />
|
||||
|
||||
_Kilo Code's interface for creating and managing custom modes._
|
||||
|
||||
## What's Included in a Custom Mode?
|
||||
|
||||
Custom modes are defined by several key properties. Understanding these concepts will help you tailor Kilo's behavior effectively.
|
||||
|
||||
| UI Field / YAML Property | Conceptual Description |
|
||||
| ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| **Slug** (`slug`) | A unique internal identifier for the mode. Used by Kilo Code to reference the mode, especially for associating mode-specific instruction files. |
|
||||
| **Name** (`name`) | The display name for the mode as it appears in the Kilo Code user interface. Should be human-readable and descriptive. |
|
||||
| **Description** (`description`) | A short, user-friendly summary of the mode's purpose displayed in the mode selector UI. Keep this concise and focused on what the mode does for the user. |
|
||||
| **Role Definition** (`roleDefinition`) | Defines the core identity and expertise of the mode. This text is placed at the beginning of the system prompt and defines Kilo's personality and behavior when this mode is active. |
|
||||
| **Available Tools** (`groups`) | Defines the allowed toolsets and file access permissions for the mode. Corresponds to selecting which general categories of tools the mode can use. |
|
||||
| **When to Use** (`whenToUse`) | _(Optional)_ Provides guidance for Kilo's automated decision-making, particularly for mode selection and task orchestration. Used by the Orchestrator mode for task coordination. |
|
||||
| **Custom Instructions** (`customInstructions`) | _(Optional)_ Specific behavioral guidelines or rules for the mode. Added near the end of the system prompt to further refine Kilo's behavior. |
|
||||
|
||||
## Import/Export Modes
|
||||
|
||||
Easily share, back up, and template your custom modes. This feature lets you export any mode—and its associated rules—into a single, portable YAML file that you can import into any project.
|
||||
|
||||
### Key Features
|
||||
|
||||
- **Shareable Setups:** Package a mode and its rules into one file to easily share with your team
|
||||
- **Easy Backups:** Save your custom mode configurations so you never lose them
|
||||
- **Project Templates:** Create standardized mode templates for different types of projects
|
||||
- **Simple Migration:** Move modes between your global settings and specific projects effortlessly
|
||||
- **Flexible Slug Changes:** Change mode slugs in exported files without manual path editing
|
||||
|
||||
### How it Works
|
||||
|
||||
**Exporting a Mode:**
|
||||
|
||||
1. Navigate to the Modes view
|
||||
2. Select the mode you wish to export
|
||||
3. Click the Export Mode button (download icon)
|
||||
4. Choose a location to save the `.yaml` file
|
||||
5. Kilo packages the mode's configuration and any rules into the YAML file
|
||||
|
||||
**Importing a Mode:**
|
||||
|
||||
1. Click the Import Mode button (upload icon) in the Modes view
|
||||
2. Select the mode's YAML file
|
||||
3. Choose the import level:
|
||||
- **Project:** Available only in current workspace (saved to `.kilocodemodes` file)
|
||||
- **Global:** Available in all projects (saved to global settings)
|
||||
|
||||
### Changing Slugs on Import
|
||||
|
||||
When importing modes, you can change the slug in the exported YAML file before importing:
|
||||
|
||||
1. Export a mode with slug `original-mode`
|
||||
2. Edit the YAML file and change the slug to `new-mode`
|
||||
3. Import the file - the import process will automatically update rule file paths to match the new slug
|
||||
|
||||
## Methods for Creating and Configuring Custom Modes
|
||||
|
||||
You can create and configure custom modes in several ways:
|
||||
|
||||
### 1. Ask Kilo! (Recommended)
|
||||
|
||||
You can quickly create a basic custom mode by asking Kilo Code to do it for you. For example:
|
||||
|
||||
```
|
||||
Create a new mode called "Documentation Writer". It should only be able to read files and write Markdown files.
|
||||
```
|
||||
|
||||
Kilo Code will guide you through the process, prompting for necessary information and creating the mode using the preferred YAML format.
|
||||
|
||||
### 2. Using the Prompts Tab
|
||||
|
||||
1. **Open Prompts Tab:** Click the <Codicon name="notebook" /> icon in the Kilo Code top menu bar
|
||||
2. **Create New Mode:** Click the <Codicon name="add" /> button to the right of the Modes heading
|
||||
3. **Fill in Fields:**
|
||||
|
||||
<img src="/img/custom-modes/custom-modes-2.png" alt="Custom mode creation interface in the Prompts tab" width="600" />
|
||||
|
||||
_The custom mode creation interface showing fields for name, slug, description, save location, role definition, available tools, custom instructions._
|
||||
|
||||
The interface provides fields for Name, Slug, Description, Save Location, Role Definition, When to Use (optional), Available Tools, and Custom Instructions. After filling these, click the "Create Mode" button. Kilo Code will save the new mode in YAML format.
|
||||
|
||||
### 3. Manual Configuration (YAML & JSON)
|
||||
|
||||
You can directly edit the configuration files to create or modify custom modes. This method offers the most control over all properties. Kilo Code now supports both YAML (preferred) and JSON formats.
|
||||
|
||||
- **Global Modes:** Edit the `custom_modes.yaml` (preferred) or `custom_modes.json` file. Access it via Prompts Tab > <Codicon name="gear" /> (Settings Menu icon next to "Global Prompts") > "Edit Global Modes"
|
||||
- **Project Modes:** Edit the `.kilocodemodes` file (which can be YAML or JSON) in your project root. Access it via Prompts Tab > <Codicon name="gear" /> (Settings Menu icon next to "Project Prompts") > "Edit Project Modes"
|
||||
|
||||
These files define an array/list of custom modes.
|
||||
|
||||
## YAML Configuration Format (Preferred)
|
||||
|
||||
YAML is now the preferred format for defining custom modes due to better readability, comment support, and cleaner multi-line strings.
|
||||
|
||||
### YAML Example
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: docs-writer
|
||||
name: 📝 Documentation Writer
|
||||
description: A specialized mode for writing and editing technical documentation.
|
||||
roleDefinition: You are a technical writer specializing in clear documentation.
|
||||
whenToUse: Use this mode for writing and editing documentation.
|
||||
customInstructions: Focus on clarity and completeness in documentation.
|
||||
groups:
|
||||
- read
|
||||
- - edit # First element of tuple
|
||||
- fileRegex: \.(md|mdx)$ # Second element is the options object
|
||||
description: Markdown files only
|
||||
- browser
|
||||
- slug: another-mode
|
||||
name: Another Mode
|
||||
# ... other properties
|
||||
```
|
||||
|
||||
### JSON Alternative
|
||||
|
||||
```json
|
||||
{
|
||||
"customModes": [
|
||||
{
|
||||
"slug": "docs-writer",
|
||||
"name": "📝 Documentation Writer",
|
||||
"description": "A specialized mode for writing and editing technical documentation.",
|
||||
"roleDefinition": "You are a technical writer specializing in clear documentation.",
|
||||
"whenToUse": "Use this mode for writing and editing documentation.",
|
||||
"customInstructions": "Focus on clarity and completeness in documentation.",
|
||||
"groups": [
|
||||
"read",
|
||||
[
|
||||
"edit",
|
||||
{ "fileRegex": "\\.(md|mdx)$", "description": "Markdown files only" }
|
||||
],
|
||||
"browser"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
## YAML/JSON Property Details
|
||||
|
||||
### `slug`
|
||||
|
||||
- **Purpose:** A unique identifier for the mode
|
||||
- **Format:** Must match the pattern `/^[a-zA-Z0-9-]+$/` (only letters, numbers, and hyphens)
|
||||
- **Usage:** Used internally and in file/directory names for mode-specific rules (e.g., `.kilo/rules-{slug}/`)
|
||||
- **Recommendation:** Keep it short and descriptive
|
||||
|
||||
**YAML Example:** `slug: docs-writer`
|
||||
**JSON Example:** `"slug": "docs-writer"`
|
||||
|
||||
### `name`
|
||||
|
||||
- **Purpose:** The display name shown in the Kilo Code UI
|
||||
- **Format:** Can include spaces and proper capitalization
|
||||
|
||||
**YAML Example:** `name: 📝 Documentation Writer`
|
||||
**JSON Example:** `"name": "Documentation Writer"`
|
||||
|
||||
### `description`
|
||||
|
||||
- **Purpose:** A short, user-friendly summary displayed below the mode name in the mode selector UI
|
||||
- **Format:** Keep this concise and focused on what the mode does for the user
|
||||
- **UI Display:** This text appears in the redesigned mode selector
|
||||
|
||||
**YAML Example:** `description: A specialized mode for writing and editing technical documentation.`
|
||||
**JSON Example:** `"description": "A specialized mode for writing and editing technical documentation."`
|
||||
|
||||
### `roleDefinition`
|
||||
|
||||
- **Purpose:** Detailed description of the mode's role, expertise, and personality
|
||||
- **Placement:** This text is placed at the beginning of the system prompt when the mode is active
|
||||
|
||||
**YAML Example (multi-line):**
|
||||
|
||||
```yaml
|
||||
roleDefinition: >-
|
||||
You are a test engineer with expertise in:
|
||||
- Writing comprehensive test suites
|
||||
- Test-driven development
|
||||
```
|
||||
|
||||
**JSON Example:** `"roleDefinition": "You are a technical writer specializing in clear documentation."`
|
||||
|
||||
### `groups`
|
||||
|
||||
- **Purpose:** Array/list defining which tool groups the mode can access and any file restrictions
|
||||
- **Available Tool Groups:** `"read"`, `"edit"`, `"browser"`, `"command"`, `"mcp"`
|
||||
- **Structure:**
|
||||
- Simple string for unrestricted access: `"edit"`
|
||||
- Tuple (two-element array) for restricted access: `["edit", { fileRegex: "pattern", description: "optional" }]`
|
||||
|
||||
**File Restrictions for "edit" group:**
|
||||
|
||||
- `fileRegex`: A regular expression string to control which files the mode can edit
|
||||
- In YAML, typically use single backslashes for regex special characters (e.g., `\.md$`)
|
||||
- In JSON, backslashes must be double-escaped (e.g., `\\.md$`)
|
||||
- `description`: An optional string describing the restriction
|
||||
|
||||
**YAML Example:**
|
||||
|
||||
```yaml
|
||||
groups:
|
||||
- read
|
||||
- - edit # First element of tuple
|
||||
- fileRegex: \.(js|ts)$ # Second element is the options object
|
||||
description: JS/TS files only
|
||||
- command
|
||||
```
|
||||
|
||||
**JSON Example:**
|
||||
|
||||
```json
|
||||
"groups": [
|
||||
"read",
|
||||
["edit", { "fileRegex": "\\.(js|ts)$", "description": "JS/TS files only" }],
|
||||
"command"
|
||||
]
|
||||
```
|
||||
|
||||
### `whenToUse` (Optional)
|
||||
|
||||
- **Purpose:** Provides guidance for Kilo's automated decision-making, particularly for mode selection and task orchestration
|
||||
- **Format:** A string describing ideal scenarios or task types for this mode
|
||||
- **Usage:** Used by Kilo for automated decisions and not displayed in the mode selector UI
|
||||
|
||||
**YAML Example:** `whenToUse: This mode is best for refactoring Python code.`
|
||||
**JSON Example:** `"whenToUse": "This mode is best for refactoring Python code."`
|
||||
|
||||
### `customInstructions` (Optional)
|
||||
|
||||
- **Purpose:** A string containing additional behavioral guidelines for the mode
|
||||
- **Placement:** This text is added near the end of the system prompt
|
||||
|
||||
**YAML Example (multi-line):**
|
||||
|
||||
```yaml
|
||||
customInstructions: |-
|
||||
When writing tests:
|
||||
- Use describe/it blocks
|
||||
- Include meaningful descriptions
|
||||
```
|
||||
|
||||
**JSON Example:** `"customInstructions": "Focus on explaining concepts and providing examples."`
|
||||
|
||||
## Benefits of YAML Format
|
||||
|
||||
YAML is now the preferred format for defining custom modes due to several advantages:
|
||||
|
||||
- **Readability:** YAML's indentation-based structure is easier for humans to read and understand
|
||||
- **Comments:** YAML allows for comments (lines starting with `#`), making it possible to annotate your mode definitions
|
||||
- **Multi-line Strings:** YAML provides cleaner syntax for multi-line strings using `|` (literal block) or `>` (folded block)
|
||||
- **Less Punctuation:** YAML generally requires less punctuation compared to JSON, reducing syntax errors
|
||||
- **Editor Support:** Most modern code editors provide excellent syntax highlighting and validation for YAML files
|
||||
|
||||
While JSON is still fully supported, new modes created via the UI or by asking Kilo will default to YAML.
|
||||
|
||||
## Migration to YAML Format
|
||||
|
||||
### Global Modes
|
||||
|
||||
Automatic migration from `custom_modes.json` to `custom_modes.yaml` happens when:
|
||||
|
||||
- Kilo Code starts up
|
||||
- A `custom_modes.json` file exists
|
||||
- No `custom_modes.yaml` file exists yet
|
||||
|
||||
The migration process preserves the original JSON file for rollback purposes.
|
||||
|
||||
### Project Modes (`.kilocodemodes`)
|
||||
|
||||
- No automatic startup migration occurs for project-specific files
|
||||
- Kilo Code can read `.kilocodemodes` files in either YAML or JSON format
|
||||
- When editing through the UI, JSON files will be converted to YAML format
|
||||
- For manual conversion, you can ask Kilo to help reformat configurations
|
||||
|
||||
## Mode-Specific Instructions via Files/Directories
|
||||
|
||||
You can provide instructions for custom modes using dedicated files or directories within your workspace, allowing for better organization and version control.
|
||||
|
||||
### Preferred Method: Directory (`.kilo/rules-{mode-slug}/`)
|
||||
|
||||
```
|
||||
.
|
||||
├── .kilo/
|
||||
│ └── rules-docs-writer/ # Example for mode slug "docs-writer"
|
||||
│ ├── 01-style-guide.md
|
||||
│ └── 02-formatting.txt
|
||||
└── ... (other project files)
|
||||
```
|
||||
|
||||
### Fallback Method: Single File (`.kilorules-{mode-slug}`)
|
||||
|
||||
```
|
||||
.
|
||||
├── .kilorules-docs-writer # Example for mode slug "docs-writer"
|
||||
└── ... (other project files)
|
||||
```
|
||||
|
||||
**Rules Directory Scope:**
|
||||
|
||||
- **Global modes:** Rules are stored in `~/.kilo/rules-{slug}/`
|
||||
- **Project modes:** Rules are stored in `{workspace}/.kilo/rules-{slug}/`
|
||||
|
||||
The directory method takes precedence if it exists and contains files. Files within the directory are read recursively and appended in alphabetical order.
|
||||
|
||||
## Configuration Precedence
|
||||
|
||||
Mode configurations are applied in this order:
|
||||
|
||||
1. **Project-level mode configurations** (from `.kilocodemodes` - YAML or JSON)
|
||||
2. **Global mode configurations** (from `custom_modes.yaml`, then `custom_modes.json` if YAML not found)
|
||||
3. **Default mode configurations**
|
||||
|
||||
**Important:** When modes with the same slug exist in both `.kilocodemodes` and global settings, the `.kilocodemodes` version completely overrides the global one for ALL properties.
|
||||
|
||||
## Overriding Default Modes
|
||||
|
||||
You can override Kilo Code's built-in modes (like 💻 Code, 🪲 Debug, ❓ Ask, 🏗️ Architect, 🪃 Orchestrator) by creating a custom mode with the same slug.
|
||||
|
||||
### Global Override Example
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: code # Matches the default 'code' mode slug
|
||||
name: 💻 Code (Global Override)
|
||||
roleDefinition: You are a software engineer with global-specific constraints.
|
||||
whenToUse: This globally overridden code mode is for JS/TS tasks.
|
||||
customInstructions: Focus on project-specific JS/TS development.
|
||||
groups:
|
||||
- read
|
||||
- - edit
|
||||
- fileRegex: \.(js|ts)$
|
||||
description: JS/TS files only
|
||||
```
|
||||
|
||||
### Project-Specific Override Example
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: code # Matches the default 'code' mode slug
|
||||
name: 💻 Code (Project-Specific)
|
||||
roleDefinition: You are a software engineer with project-specific constraints for this project.
|
||||
whenToUse: This project-specific code mode is for Python tasks within this project.
|
||||
customInstructions: Adhere to PEP8 and use type hints.
|
||||
groups:
|
||||
- read
|
||||
- - edit
|
||||
- fileRegex: \.py$
|
||||
description: Python files only
|
||||
- command
|
||||
```
|
||||
|
||||
## Understanding Regex in Custom Modes
|
||||
|
||||
Regular expressions (`fileRegex`) offer fine-grained control over file editing permissions.
|
||||
|
||||
:::tip
|
||||
**Let Kilo Build Your Regex Patterns**
|
||||
|
||||
Instead of writing complex regex manually, ask Kilo:
|
||||
|
||||
```
|
||||
Create a regex pattern that matches JavaScript files but excludes test files
|
||||
```
|
||||
|
||||
Kilo will generate the pattern. Remember to adapt it for YAML (usually single backslashes) or JSON (double backslashes).
|
||||
:::
|
||||
|
||||
### Important Rules for `fileRegex`
|
||||
|
||||
- **Escaping in JSON:** In JSON strings, backslashes (`\`) must be double-escaped (e.g., `\\.md$`)
|
||||
- **Escaping in YAML:** In unquoted or single-quoted YAML strings, a single backslash is usually sufficient for regex special characters (e.g., `\.md$`)
|
||||
- **Path Matching:** Patterns match against the full relative file path from your workspace root
|
||||
- **Case Sensitivity:** Regex patterns are case-sensitive by default
|
||||
- **Validation:** Invalid regex patterns are rejected with an "Invalid regular expression pattern" error message
|
||||
|
||||
### Common Pattern Examples
|
||||
|
||||
| Pattern (YAML-like) | JSON fileRegex Value | Matches | Doesn't Match |
|
||||
| -------------------------------- | ----------------------------------- | ----------------------------------------- | ---------------------------------- |
|
||||
| `\.md$` | `"\\.md$"` | `readme.md`, `docs/guide.md` | `script.js`, `readme.md.bak` |
|
||||
| `^src/.*` | `"^src/.*"` | `src/app.js`, `src/components/button.tsx` | `lib/utils.js`, `test/src/mock.js` |
|
||||
| `\.(css\|scss)$` | `"\\.(css\|scss)$"` | `styles.css`, `theme.scss` | `styles.less`, `styles.css.map` |
|
||||
| `docs/.*\.md$` | `"docs/.*\\.md$"` | `docs/guide.md`, `docs/api/reference.md` | `guide.md`, `src/docs/notes.md` |
|
||||
| `^(?!.*(test\|spec))\.(js\|ts)$` | `"^(?!.*(test\|spec))\\.(js\|ts)$"` | `app.js`, `utils.ts` | `app.test.js`, `utils.spec.js` |
|
||||
|
||||
### Key Regex Building Blocks
|
||||
|
||||
- `\.`: Matches a literal dot (YAML: `\.`, JSON: `\\.`)
|
||||
- `$`: Matches the end of the string
|
||||
- `^`: Matches the beginning of the string
|
||||
- `.*`: Matches any character (except newline) zero or more times
|
||||
- `(a|b)`: Matches either "a" or "b"
|
||||
- `(?!...)`: Negative lookahead
|
||||
|
||||
## Error Handling
|
||||
|
||||
When a mode attempts to edit a file that doesn't match its `fileRegex` pattern, you'll see a `FileRestrictionError` that includes:
|
||||
|
||||
- The mode name
|
||||
- The allowed file pattern
|
||||
- The description (if provided)
|
||||
- The attempted file path
|
||||
- The tool that was blocked
|
||||
|
||||
## Example Configurations
|
||||
|
||||
### Basic Documentation Writer (YAML)
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: docs-writer
|
||||
name: 📝 Documentation Writer
|
||||
description: Specialized for writing and editing technical documentation
|
||||
roleDefinition: You are a technical writer specializing in clear documentation
|
||||
groups:
|
||||
- read
|
||||
- - edit
|
||||
- fileRegex: \.md$
|
||||
description: Markdown files only
|
||||
customInstructions: Focus on clear explanations and examples
|
||||
```
|
||||
|
||||
### Test Engineer with File Restrictions (YAML)
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: test-engineer
|
||||
name: 🧪 Test Engineer
|
||||
description: Focused on writing and maintaining test suites
|
||||
roleDefinition: You are a test engineer focused on code quality
|
||||
whenToUse: Use for writing tests, debugging test failures, and improving test coverage
|
||||
groups:
|
||||
- read
|
||||
- - edit
|
||||
- fileRegex: \.(test|spec)\.(js|ts)$
|
||||
description: Test files only
|
||||
- command
|
||||
```
|
||||
|
||||
### Security Review Mode (YAML)
|
||||
|
||||
```yaml
|
||||
customModes:
|
||||
- slug: security-review
|
||||
name: 🔒 Security Reviewer
|
||||
description: Read-only security analysis and vulnerability assessment
|
||||
roleDefinition: You are a security specialist reviewing code for vulnerabilities
|
||||
whenToUse: Use for security reviews and vulnerability assessments
|
||||
customInstructions: |-
|
||||
Focus on:
|
||||
- Input validation issues
|
||||
- Authentication and authorization flaws
|
||||
- Data exposure risks
|
||||
- Injection vulnerabilities
|
||||
groups:
|
||||
- read
|
||||
- browser
|
||||
```
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
- **Mode not appearing:** After creating or importing a mode, you may need to reload the VS Code window
|
||||
- **Invalid regex patterns:** Test your patterns using online regex testers before applying them
|
||||
- **Precedence confusion:** Remember that project modes completely override global modes with the same slug
|
||||
- **YAML syntax errors:** Use proper indentation (spaces, not tabs) and validate your YAML
|
||||
|
||||
### Tips for Working with YAML
|
||||
|
||||
- **Indentation is Key:** YAML uses indentation (spaces, not tabs) to define structure
|
||||
- **Colons for Key-Value Pairs:** Keys must be followed by a colon and a space (e.g., `slug: my-mode`)
|
||||
- **Hyphens for List Items:** List items start with a hyphen and a space (e.g., `- read`)
|
||||
- **Validate Your YAML:** Use online YAML validators or your editor's built-in validation
|
||||
|
||||
## Community Gallery
|
||||
|
||||
Ready to explore more? Check out the [Show and Tell](https://github.com/Kilo-Org/kilocode/discussions/categories/show-and-tell) to discover and share custom modes created by the community!
|
||||
@@ -1,54 +0,0 @@
|
||||
# Enhance Prompt
|
||||
|
||||
The "Enhance Prompt" feature in Kilo Code helps you improve the quality and effectiveness of your prompts before sending them to the AI model. By clicking the <Codicon name="sparkle" /> icon in the chat input, you can automatically refine your initial request, making it clearer, more specific, and more likely to produce the desired results.
|
||||
|
||||
## Why Use Enhance Prompt?
|
||||
|
||||
* **Improved Clarity:** Kilo Code can rephrase your prompt to make it more understandable for the AI model.
|
||||
* **Added Context:** The enhancement process can add relevant context to your prompt, such as the current file path or selected code.
|
||||
* **Better Instructions:** Kilo Code can add instructions to guide the AI towards a more helpful response (e.g., requesting specific formatting or a particular level of detail).
|
||||
* **Reduced Ambiguity:** Enhance Prompt helps to eliminate ambiguity and ensure that Kilo Code understands your intent.
|
||||
* **Consistency**: Kilo will consistently format prompts the same way to the AI.
|
||||
|
||||
### Before and after
|
||||
|
||||
<img src="/docs/img/enhance-prompt/before.png" alt="very primitive prompt" width="300" style={{display: 'inline-block', marginRight: '20px', verticalAlign: 'middle'}} />
|
||||
<img src="/docs/img/enhance-prompt/after.png" alt="enhanced prompt" width="300" style={{display: 'inline-block', verticalAlign: 'middle'}} />
|
||||
|
||||
## How to Use Enhance Prompt
|
||||
|
||||
1. **Type your initial prompt:** Enter your request in the Kilo Code chat input box as you normally would. This can be a simple question, a complex task description, or anything in between.
|
||||
2. **Click the <Codicon name="sparkle" /> Icon:** Instead of pressing Enter, click the <Codicon name="sparkle" /> icon located in the bottom right of the chat input box.
|
||||
3. **Review the Enhanced Prompt:** Kilo Code will replace your original prompt with an enhanced version. Review the enhanced prompt to make sure it accurately reflects your intent. You can further refine the enhanced prompt before sending.
|
||||
4. **Send the Enhanced Prompt:** Press Enter or click the Send icon (<Codicon name="send" />) to send the enhanced prompt to Kilo Code.
|
||||
|
||||
## Customizing the Enhancement Process
|
||||
|
||||
### Customizing Template
|
||||
|
||||
The "Enhance Prompt" feature uses a customizable prompt template. You can modify this template to tailor the enhancement process to your specific needs.
|
||||
|
||||
1. **Open the Prompts Tab:** Click the <Codicon name="notebook" /> icon in the Kilo Code top menu bar.
|
||||
2. **Select "ENHANCE" Tab:** You should see listed out support prompts, including "ENHANCE". Click on this tab.
|
||||
3. **Edit the Prompt Template:** Modify the text in the "Prompt" field.
|
||||
|
||||
The default prompt template includes the placeholder `${userInput}`, which will be replaced with your original prompt. You can modify this to fit the model's prompt format, and instruct it how to enhance your request.
|
||||
|
||||
### Customizing Provider
|
||||
|
||||
Speed up prompt enhancement by switching to a more lightweight LLM model provider (e.g. GPT 4.1 Nano). This delivers faster results at lower cost while maintaining quality.
|
||||
|
||||
Create a dedicated profile for Enhance Prompt by following the [API configuration profiles guide](/features/api-configuration-profiles).
|
||||
|
||||
<img src="/docs/img/enhance-prompt/custom-enhance-profile.png" alt="Custom profile configuration for Enhance Prompt feature" width="600" />
|
||||
|
||||
For a detailed walkthrough: https://youtu.be/R1nDnCK-xzw
|
||||
|
||||
## Limitations and Best Practices
|
||||
|
||||
* **Experimental Feature:** Prompt enhancement is an experimental feature. The quality of the enhanced prompt may vary depending on the complexity of your request and the capabilities of the underlying model.
|
||||
* **Review Carefully:** Always review the enhanced prompt before sending it. Kilo Code may make changes that don't align with your intentions.
|
||||
* **Iterative Process:** You can use the "Enhance Prompt" feature multiple times to iteratively refine your prompt.
|
||||
* **Not a Replacement for Clear Instructions:** While "Enhance Prompt" can help, it's still important to write clear and specific prompts from the start.
|
||||
|
||||
By using the "Enhance Prompt" feature, you can improve the quality of your interactions with Kilo Code and get more accurate and helpful responses.
|
||||
@@ -1,35 +0,0 @@
|
||||
# Experimental Features
|
||||
|
||||
Kilo Code includes experimental features that are still under development. These features may be unstable, change significantly, or be removed in future versions. Use them with caution and be aware that they may not work as expected.
|
||||
|
||||
**Warning:** Experimental features may have unexpected behavior, including potential data loss or security vulnerabilities. Enable them at your own risk.
|
||||
|
||||
## Enabling Experimental Features
|
||||
|
||||
To enable or disable experimental features:
|
||||
|
||||
1. Open the Kilo Code settings (<Codicon name="gear" /> icon in the top right corner).
|
||||
2. Go to the "Advanced Settings" section.
|
||||
3. Find the "Experimental Features" section.
|
||||
4. Check or uncheck the boxes for the features you want to enable or disable.
|
||||
5. Click "Done" to save your changes.
|
||||
|
||||
## Current Experimental Features
|
||||
|
||||
The following experimental features are currently available:
|
||||
|
||||
## Autocomplete
|
||||
When enabled, Kilo Code will provide inline code suggestions as you type. Currently this requires the Kilo Code API Provider in order to use it.
|
||||
|
||||
## Concurrent file edits
|
||||
When enabled, Kilo Code can edit multiple files in a single request. When disabled, Kilo Code must edit one file at a time. Disabling this can help when working with less capable models or when you want more control over file modifications.
|
||||
|
||||
### Power Steering
|
||||
|
||||
When enabled, Kilo Code will remind the model about the details of its current mode definition more frequently. This will lead to stronger adherence to role definitions and custom instructions, but will use more tokens per message.
|
||||
|
||||
## Providing Feedback
|
||||
|
||||
If you encounter any issues with experimental features, or if you have suggestions for improvements, please report them on the [Kilo Code Code GitHub Issues page](https://github.com/Kilo-Org/kilocode) or join our [Discord server](https://kilo.love/discord) where we have channels dedciated to many experimental features.
|
||||
|
||||
Your feedback is valuable and helps us improve Kilo Code!
|
||||
@@ -1,52 +0,0 @@
|
||||
---
|
||||
sidebar_label: 'Footgun Prompting'
|
||||
---
|
||||
|
||||
# Footgun Prompting: Override System Prompts
|
||||
|
||||
Footgun Prompting, AKA Overriding System Prompt, allows advanced users to completely replace the default system prompt for a specific Kilo Code mode. This provides granular control over the AI's behavior but bypasses built-in safeguards.
|
||||
|
||||
:::info **footgun** *(noun)*
|
||||
|
||||
1. *(programming slang, humorous, derogatory)* Any feature likely to lead to the programmer shooting themself in the foot.
|
||||
|
||||
> The System Prompt Override is considered a footgun because modifying the core instructions without a deep understanding can lead to unexpected or broken behavior, especially regarding tool usage and response consistency.
|
||||
|
||||
:::
|
||||
|
||||
## How It Works
|
||||
|
||||
1. **Override File:** Create a file named `.kilocode/system-prompt-{mode-slug}` in your workspace root (e.g., `.kilocode/system-prompt-code` for the Code mode).
|
||||
2. **Content:** The content of this file becomes the new system prompt for that specific mode.
|
||||
3. **Activation:** Kilo Code automatically detects this file. When present, it replaces most of the standard system prompt sections.
|
||||
4. **Preserved Sections:** Only the core `roleDefinition` and any `customInstructions` you've set for the mode are kept alongside your override content. Standard sections like tool descriptions, rules, and capabilities are bypassed.
|
||||
5. **Construction:** The final prompt sent to the model looks like this:
|
||||
```
|
||||
${roleDefinition}
|
||||
|
||||
${content_of_your_override_file}
|
||||
|
||||
${customInstructions}
|
||||
```
|
||||
|
||||
## Accessing the Feature
|
||||
|
||||
You can find the option and instructions within the Kilo Code UI:
|
||||
|
||||
1. Click the MODE selector in the bottom-left of the Kilo Code text-input box.
|
||||
2. Click "Edit..." at the bottom of the mode-selection list
|
||||
3. Expand the **"Advanced: Override System Prompt"** section at the bottom.
|
||||
4. Clicking the file path link within the explanation will open or create the correct override file for the currently selected mode in VS Code.
|
||||
|
||||
<img src="/docs/img/footgun-prompting/footgun-prompting.png" alt="UI showing the Advanced: Override System Prompt section" width="500" />
|
||||
|
||||
|
||||
## Key Considerations & Warnings
|
||||
|
||||
- **Intended Audience:** Best suited for users deeply familiar with Kilo Code's prompting system and the implications of modifying core instructions.
|
||||
- **Impact on Functionality:** Custom prompts override standard instructions, including those for tool usage and response consistency. This can cause unexpected behavior or errors if not managed carefully.
|
||||
- **Mode-Specific:** Each override file applies only to the mode specified in its filename (`{mode-slug}`).
|
||||
- **No File, No Override:** If the `.kilocode/system-prompt-{mode-slug}` file doesn't exist, Kilo Code uses the standard system prompt generation process for that mode.
|
||||
- **Directory Creation:** Kilo Code ensures the `.kilocode` directory exists before attempting to read or create the override file.
|
||||
|
||||
Use this feature cautiously. While powerful for customization, incorrect implementation can significantly degrade Kilo Code's performance and reliability for the affected mode.
|
||||
@@ -1,20 +0,0 @@
|
||||
---
|
||||
title: MCP Overview
|
||||
sidebar_label: MCP Overview
|
||||
---
|
||||
|
||||
# Model Context Protocol (MCP)
|
||||
|
||||
The Model Context Protocol (MCP) is a standard for extending Kilo Code's capabilities by connecting to external tools and services. MCP servers provide additional tools and resources that help Kilo Code accomplish tasks beyond its built-in capabilities, such as accessing databases, custom APIs, and specialized functionality.
|
||||
|
||||
## MCP Documentation
|
||||
|
||||
This documentation is organized into several sections:
|
||||
|
||||
* [**Using MCP in Kilo Code**](/features/mcp/using-mcp-in-kilo-code) - Comprehensive guide to configuring, enabling, and managing MCP servers with Kilo Code. Includes server settings, tool approval, and troubleshooting.
|
||||
|
||||
* [**What is MCP?**](/features/mcp/what-is-mcp) - Clear explanation of the Model Context Protocol, its client-server architecture, and how it enables AI systems to interact with external tools.
|
||||
|
||||
* [**STDIO & SSE Transports**](/features/mcp/server-transports) - Detailed comparison of local (STDIO) and remote (SSE) transport mechanisms with deployment considerations for each approach.
|
||||
|
||||
* [**MCP vs API**](/features/mcp/mcp-vs-api) - Analysis of the fundamental distinction between MCP and REST APIs, explaining how they operate at different layers of abstraction for AI systems.
|
||||
@@ -1,196 +0,0 @@
|
||||
---
|
||||
title: MCP Server Transports
|
||||
sidebar_label: STDIO & SSE Transports
|
||||
---
|
||||
|
||||
# MCP Server Transports: STDIO & SSE
|
||||
|
||||
Model Context Protocol (MCP) supports two primary transport mechanisms for communication between Kilo Code and MCP servers: Standard Input/Output (STDIO) and Server-Sent Events (SSE). Each has distinct characteristics, advantages, and use cases.
|
||||
|
||||
## STDIO Transport
|
||||
|
||||
STDIO transport runs locally on your machine and communicates via standard input/output streams.
|
||||
|
||||
### How STDIO Transport Works
|
||||
|
||||
1. The client (Kilo Code) spawns an MCP server as a child process
|
||||
2. Communication happens through process streams: client writes to server's STDIN, server responds to STDOUT
|
||||
3. Each message is delimited by a newline character
|
||||
4. Messages are formatted as JSON-RPC 2.0
|
||||
|
||||
```
|
||||
Client Server
|
||||
| |
|
||||
|---- JSON message ------>| (via STDIN)
|
||||
| | (processes request)
|
||||
|<---- JSON message ------| (via STDOUT)
|
||||
| |
|
||||
```
|
||||
|
||||
### STDIO Characteristics
|
||||
|
||||
* **Locality**: Runs on the same machine as Kilo Code
|
||||
* **Performance**: Very low latency and overhead (no network stack involved)
|
||||
* **Simplicity**: Direct process communication without network configuration
|
||||
* **Relationship**: One-to-one relationship between client and server
|
||||
* **Security**: Inherently more secure as no network exposure
|
||||
|
||||
### When to Use STDIO
|
||||
|
||||
STDIO transport is ideal for:
|
||||
|
||||
* Local integrations and tools running on the same machine
|
||||
* Security-sensitive operations
|
||||
* Low-latency requirements
|
||||
* Single-client scenarios (one Kilo Code instance per server)
|
||||
* Command-line tools or IDE extensions
|
||||
|
||||
### STDIO Implementation Example
|
||||
|
||||
```typescript
|
||||
import { Server } from '@modelcontextprotocol/sdk/server/index.js';
|
||||
import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
|
||||
|
||||
const server = new Server({name: 'local-server', version: '1.0.0'});
|
||||
// Register tools...
|
||||
|
||||
// Use STDIO transport
|
||||
const transport = new StdioServerTransport(server);
|
||||
transport.listen();
|
||||
```
|
||||
|
||||
## SSE Transport
|
||||
|
||||
Server-Sent Events (SSE) transport runs on a remote server and communicates over HTTP/HTTPS.
|
||||
|
||||
### How SSE Transport Works
|
||||
|
||||
1. The client (Kilo Code) connects to the server's SSE endpoint via HTTP GET request
|
||||
2. This establishes a persistent connection where the server can push events to the client
|
||||
3. For client-to-server communication, the client makes HTTP POST requests to a separate endpoint
|
||||
4. Communication happens over two channels:
|
||||
* Event Stream (GET): Server-to-client updates
|
||||
* Message Endpoint (POST): Client-to-server requests
|
||||
|
||||
```
|
||||
Client Server
|
||||
| |
|
||||
|---- HTTP GET /events ----------->| (establish SSE connection)
|
||||
|<---- SSE event stream -----------| (persistent connection)
|
||||
| |
|
||||
|---- HTTP POST /message --------->| (client request)
|
||||
|<---- SSE event with response ----| (server response)
|
||||
| |
|
||||
```
|
||||
|
||||
### SSE Characteristics
|
||||
|
||||
* **Remote Access**: Can be hosted on a different machine from Kilo Code
|
||||
* **Scalability**: Can handle multiple client connections concurrently
|
||||
* **Protocol**: Works over standard HTTP (no special protocols needed)
|
||||
* **Persistence**: Maintains a persistent connection for server-to-client messages
|
||||
* **Authentication**: Can use standard HTTP authentication mechanisms
|
||||
|
||||
### When to Use SSE
|
||||
|
||||
SSE transport is better for:
|
||||
|
||||
* Remote access across networks
|
||||
* Multi-client scenarios
|
||||
* Public services
|
||||
* Centralized tools that many users need to access
|
||||
* Integration with web services
|
||||
|
||||
### SSE Implementation Example
|
||||
|
||||
```typescript
|
||||
import { Server } from '@modelcontextprotocol/sdk/server/index.js';
|
||||
import { SSEServerTransport } from '@modelcontextprotocol/sdk/server/sse.js';
|
||||
import express from 'express';
|
||||
|
||||
const app = express();
|
||||
const server = new Server({name: 'remote-server', version: '1.0.0'});
|
||||
// Register tools...
|
||||
|
||||
// Use SSE transport
|
||||
const transport = new SSEServerTransport(server);
|
||||
app.use('/mcp', transport.requestHandler());
|
||||
app.listen(3000, () => {
|
||||
console.log('MCP server listening on port 3000');
|
||||
});
|
||||
```
|
||||
## Local vs. Hosted: Deployment Aspects
|
||||
|
||||
The choice between STDIO and SSE transports directly impacts how you'll deploy and manage your MCP servers.
|
||||
|
||||
### STDIO: Local Deployment Model
|
||||
|
||||
STDIO servers run locally on the same machine as Kilo Code, which has several important implications:
|
||||
|
||||
* **Installation**: The server executable must be installed on each user's machine
|
||||
* **Distribution**: You need to provide installation packages for different operating systems
|
||||
* **Updates**: Each instance must be updated separately
|
||||
* **Resources**: Uses the local machine's CPU, memory, and disk
|
||||
* **Access Control**: Relies on the local machine's filesystem permissions
|
||||
* **Integration**: Easy integration with local system resources (files, processes)
|
||||
* **Execution**: Starts and stops with Kilo Code (child process lifecycle)
|
||||
* **Dependencies**: Any dependencies must be installed on the user's machine
|
||||
|
||||
#### Practical Example
|
||||
|
||||
A local file search tool using STDIO would:
|
||||
* Run on the user's machine
|
||||
* Have direct access to the local filesystem
|
||||
* Start when needed by Kilo Code
|
||||
* Not require network configuration
|
||||
* Need to be installed alongside Kilo Code or via a package manager
|
||||
|
||||
### SSE: Hosted Deployment Model
|
||||
|
||||
SSE servers can be deployed to remote servers and accessed over the network:
|
||||
|
||||
* **Installation**: Installed once on a server, accessed by many users
|
||||
* **Distribution**: Single deployment serves multiple clients
|
||||
* **Updates**: Centralized updates affect all users immediately
|
||||
* **Resources**: Uses server resources, not local machine resources
|
||||
* **Access Control**: Managed through authentication and authorization systems
|
||||
* **Integration**: More complex integration with user-specific resources
|
||||
* **Execution**: Runs as an independent service (often continuously)
|
||||
* **Dependencies**: Managed on the server, not on user machines
|
||||
|
||||
#### Practical Example
|
||||
|
||||
A database query tool using SSE would:
|
||||
* Run on a central server
|
||||
* Connect to databases with server-side credentials
|
||||
* Be continuously available for multiple users
|
||||
* Require proper network security configuration
|
||||
* Be deployed using container or cloud technologies
|
||||
|
||||
### Hybrid Approaches
|
||||
|
||||
Some scenarios benefit from a hybrid approach:
|
||||
|
||||
1. **STDIO with Network Access**: A local STDIO server that acts as a proxy to remote services
|
||||
2. **SSE with Local Commands**: A remote SSE server that can trigger operations on the client machine through callbacks
|
||||
3. **Gateway Pattern**: STDIO servers for local operations that connect to SSE servers for specialized functions
|
||||
|
||||
## Choosing Between STDIO and SSE
|
||||
|
||||
| Consideration | STDIO | SSE |
|
||||
|---------------|-------|-----|
|
||||
| **Location** | Local machine only | Local or remote |
|
||||
| **Clients** | Single client | Multiple clients |
|
||||
| **Performance** | Lower latency | Higher latency (network overhead) |
|
||||
| **Setup Complexity** | Simpler | More complex (requires HTTP server) |
|
||||
| **Security** | Inherently secure | Requires explicit security measures |
|
||||
| **Network Access** | Not needed | Required |
|
||||
| **Scalability** | Limited to local machine | Can distribute across network |
|
||||
| **Deployment** | Per-user installation | Centralized installation |
|
||||
| **Updates** | Distributed updates | Centralized updates |
|
||||
| **Resource Usage** | Uses client resources | Uses server resources |
|
||||
| **Dependencies** | Client-side dependencies | Server-side dependencies |
|
||||
|
||||
## Configuring Transports in Kilo Code
|
||||
|
||||
For detailed information on configuring STDIO and SSE transports in Kilo Code, including example configurations, see the [Understanding Transport Types](/features/mcp/using-mcp-in-kilo-code#understanding-transport-types) section in the Using MCP in Kilo Code guide.
|
||||
@@ -1,93 +0,0 @@
|
||||
# Model Temperature
|
||||
|
||||
Temperature controls the randomness of AI model outputs. Adjusting this setting optimizes results for different tasks - from precise code generation to creative brainstorming. Temperature is one of the most powerful parameters for controlling AI behavior. A well-tuned temperature setting can dramatically improve the quality and appropriateness of responses for specific tasks.
|
||||
|
||||
<img src="/docs/img/model-temperature/model-temperature.gif" alt="Animation showing temperature slider adjustment" width="100%" />
|
||||
|
||||
## What is Temperature?
|
||||
|
||||
Temperature is a setting (usually between 0.0 and 2.0) that controls how random or predictable the AI's output is. Finding the right balance is key: lower values make the output more focused and consistent, while higher values encourage more creativity and variation. For many coding tasks, a moderate temperature (around 0.3 to 0.7) often works well, but the best setting depends on what you're trying to achieve.
|
||||
|
||||
:::info Temperature and Code: Common Misconceptions
|
||||
Temperature controls output randomness, not code quality or accuracy directly. Key points:
|
||||
|
||||
* **Low Temperature (near 0.0):** Produces predictable, consistent code. Good for simple tasks, but can be repetitive and lack creativity. It doesn't guarantee *better* code.
|
||||
* **High Temperature:** Increases randomness, potentially leading to creative solutions but also more errors or nonsensical code. It doesn't guarantee *higher-quality* code.
|
||||
* **Accuracy:** Code accuracy depends on the model's training and prompt clarity, not temperature.
|
||||
* **Temperature 0.0:** Useful for consistency, but limits exploration needed for complex problems.
|
||||
:::
|
||||
|
||||
## Default Values in Kilo Code
|
||||
|
||||
Kilo Code uses a default temperature of 0.0 for most models, optimizing for maximum determinism and precision in code generation. This applies to OpenAI models, Anthropic models (non-thinking variants), LM Studio models, and most other providers.
|
||||
|
||||
Some models use higher default temperatures - DeepSeek R1 models and certain reasoning-focused models default to 0.6, providing a balance between determinism and creative exploration.
|
||||
|
||||
Models with thinking capabilities (where the AI shows its reasoning process) require a fixed temperature of 1.0 which cannot be changed, as this setting ensures optimal performance of the thinking mechanism. This applies to any model with the ":thinking" flag enabled.
|
||||
|
||||
Some specialized models don't support temperature adjustments at all, in which case Kilo Code respects these limitations automatically.
|
||||
|
||||
## When to Adjust Temperature
|
||||
|
||||
Here are some examples of temperature settings that might work well for different tasks:
|
||||
|
||||
* **Code Mode (0.0-0.3):** For writing precise, correct code with consistent, deterministic results
|
||||
* **Architect Mode (0.4-0.7):** For brainstorming architecture or design solutions with balanced creativity and structure
|
||||
* **Ask Mode (0.7-1.0):** For explanations or open-ended questions requiring diverse and insightful responses
|
||||
* **Debug Mode (0.0-0.3):** For troubleshooting bugs with consistent precision
|
||||
|
||||
These are starting points – it's important to [experiment with different settings](#experimentation) to find what works best for your specific needs and preferences.
|
||||
|
||||
## How to Adjust Temperature
|
||||
|
||||
1. **Open the Kilo Code Panel:** Click the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in the VS Code Side Bar
|
||||
2. **Open Settings:** Click the <Codicon name="gear" /> icon in the top right corner
|
||||
3. **Find Temperature Control:** Navigate to the Providers section
|
||||
4. **Enable Custom Temperature:** Check the "Use custom temperature" box
|
||||
5. **Set Your Value:** Adjust the slider to your preferred value
|
||||
|
||||
<img src="/docs/img/model-temperature/model-temperature.png" alt="Temperature setting in Kilo Code settings panel" width="550" />
|
||||
*Temperature slider in Kilo Code settings panel*
|
||||
|
||||
## Using API Configuration Profiles for Temperature
|
||||
|
||||
Create multiple [API configuration profiles](/features/api-configuration-profiles) with different temperature settings:
|
||||
|
||||
**How to set up task-specific temperature profiles:**
|
||||
|
||||
1. Create specialized profiles like "Code - Low Temp" (0.1) and "Ask - High Temp" (0.8)
|
||||
2. Configure each profile with appropriate temperature settings
|
||||
3. Switch between profiles using the dropdown in settings or chat interface
|
||||
4. Set different profiles as defaults for each mode for automatic switching when changing modes
|
||||
|
||||
This approach optimizes model behavior for specific tasks without manual adjustments.
|
||||
|
||||
## Technical Implementation
|
||||
|
||||
Kilo Code implements temperature handling with these considerations:
|
||||
|
||||
* User-defined settings take priority over defaults
|
||||
* Provider-specific behaviors are respected
|
||||
* Model-specific limitations are enforced:
|
||||
* Thinking-enabled models require a fixed temperature of 1.0
|
||||
* Some models don't support temperature adjustments
|
||||
|
||||
## Experimentation
|
||||
|
||||
Experimenting with different temperature settings is the most effective way to discover what works best for your specific needs:
|
||||
|
||||
### Effective Temperature Testing
|
||||
|
||||
1. **Start with defaults** - Begin with Kilo Code's preset values (0.0 for most tasks) as your baseline
|
||||
2. **Make incremental adjustments** - Change values in small steps (±0.1) to observe subtle differences
|
||||
3. **Test consistently** - Use the same prompt across different temperature settings for valid comparisons
|
||||
4. **Document results** - Note which values produce the best outcomes for specific types of tasks
|
||||
5. **Create profiles** - Save effective settings as [API configuration profiles](/features/api-configuration-profiles) for quick access
|
||||
|
||||
Remember that different models may respond differently to the same temperature values, and thinking-enabled models always use a fixed temperature of 1.0 regardless of your settings.
|
||||
|
||||
## Related Features
|
||||
|
||||
- Works with all [API providers](/providers/openai) supported by Kilo Code
|
||||
- Complements [custom instructions](/advanced-usage/custom-instructions) for fine-tuning responses
|
||||
- Works alongside [custom modes](/features/custom-modes) you create
|
||||
@@ -1,41 +0,0 @@
|
||||
---
|
||||
sidebar_label: Additional Features
|
||||
---
|
||||
|
||||
|
||||
# Additional Features
|
||||
|
||||
Kilo Code's extras streamline routine tasks and improve accessibility.
|
||||
|
||||
## Suggested Responses
|
||||
|
||||
Kilo Code offers suggested responses so you spend less time typing.
|
||||
- After you ask a question, buttons appear below the chat box.
|
||||
- Click a button to reuse it as your next prompt.
|
||||
|
||||
## Text to Speech
|
||||
|
||||
The Text-to-Speech feature lets Kilo Code read responses aloud.
|
||||
1. Enable TTS in settings.
|
||||
2. Click the speaker icon next to any response to start listening.
|
||||
|
||||
## Global Language Support
|
||||
|
||||
Kilo Code supports 14 languages:
|
||||
|
||||
- Simplified Chinese
|
||||
- Traditional Chinese
|
||||
- Spanish
|
||||
- Hindi
|
||||
- French
|
||||
- Portuguese
|
||||
- German
|
||||
- Japanese
|
||||
- Korean
|
||||
- Italian
|
||||
- Turkish
|
||||
- Vietnamese
|
||||
- Polish
|
||||
- Catalan
|
||||
|
||||
Change languages under **Advanced Settings > Language**.
|
||||
@@ -1,60 +0,0 @@
|
||||
---
|
||||
title: Import, Export, and Reset Settings
|
||||
sidebar_label: Import/Export/Reset Settings
|
||||
description: Manage your Kilo Code settings by exporting, importing, or resetting them to defaults.
|
||||
---
|
||||
|
||||
# Import, Export, and Reset Settings
|
||||
|
||||
Kilo Code allows you to manage your configuration settings effectively through export, import, and reset options. These features are useful for backing up your setup, sharing configurations with others, or restoring default settings if needed.
|
||||
|
||||
You can find these options at the bottom of the Kilo Code settings page, accessible via the gear icon (<i class="codicon codicon-gear"></i>) in the Kilo Code chat view.
|
||||
|
||||
<img src="/docs/img/settings-management/settings-management.png" alt="Export, Import, and Reset buttons in Kilo Code settings" width="400" />
|
||||
*Image: Export, Import, and Reset buttons.*
|
||||
|
||||
## Export Settings
|
||||
|
||||
Clicking the **Export** button saves your current Kilo Code settings to a JSON file.
|
||||
|
||||
* **What's Exported:** The file includes your configured API Provider Profiles and Global Settings (UI preferences, mode configurations, context settings, etc.).
|
||||
* **Security Warning:** The exported JSON file contains **all** your configured API Provider Profiles and Global Settings. Crucially, this includes **API keys in plaintext**. Treat this file as highly sensitive. Do not share it publicly or with untrusted individuals, as it grants access to your API accounts.
|
||||
* **Process:**
|
||||
1. Click **Export**.
|
||||
2. A file save dialog appears, suggesting `kilo-code-settings.json` as the filename (usually in your `~/Documents` folder).
|
||||
3. Choose a location and save the file.
|
||||
|
||||
This creates a backup of your configuration or a file you can share.
|
||||
|
||||
## Import Settings
|
||||
|
||||
Clicking the **Import** button allows you to load settings from a previously exported JSON file.
|
||||
|
||||
* **Process:**
|
||||
1. Click **Import**.
|
||||
2. A file open dialog appears. Select the `kilo-code-settings.json` file (or similarly named file) you want to import.
|
||||
3. Kilo Code reads the file, validates its contents against the expected schema, and applies the settings.
|
||||
* **Merging:** Importing settings **merges** the configurations. It adds new API profiles and updates existing ones and global settings based on the file content. It does **not** delete configurations present in your current setup but missing from the imported file.
|
||||
* **Validation:** Only valid settings matching the internal schema can be imported, preventing configuration errors. A success notification appears upon completion.
|
||||
|
||||
## Reset Settings
|
||||
|
||||
Clicking the **Reset** button completely clears all Kilo Code configuration data and returns the extension to its default state. This is a destructive action intended for troubleshooting or starting fresh.
|
||||
|
||||
* **Warning:** This action is **irreversible**. It permanently deletes all API configurations (including keys stored in secret storage), custom modes, global settings, and task history.
|
||||
|
||||
* **Process:**
|
||||
1. Click the red **Reset** button.
|
||||
2. A confirmation dialog appears, warning that the action cannot be undone.
|
||||
3. Click "Yes" to confirm.
|
||||
|
||||
* **What is Reset:**
|
||||
* **API Provider Profiles:** All configurations are deleted from settings and secret storage.
|
||||
* **Global Settings:** All preferences (UI, modes, approvals, browser, etc.) are reset to defaults.
|
||||
* **Custom Modes:** All user-defined modes are deleted.
|
||||
* **Secret Storage:** All API keys and other secrets managed by Kilo Code are cleared.
|
||||
* **Task History:** The current task stack is cleared.
|
||||
|
||||
* **Result:** Kilo Code returns to its initial state, as if freshly installed, with default settings and no user configurations.
|
||||
|
||||
Use this option only if you are certain you want to remove all Kilo Code data or if instructed during troubleshooting. Consider exporting your settings first if you might want to restore them later.
|
||||
@@ -1,382 +0,0 @@
|
||||
# Terminal Shell Integration
|
||||
|
||||
Terminal Shell Integration is a key feature that enables Kilo Code to execute commands in your terminal and intelligently process their output. This bidirectional communication between the AI and your development environment unlocks powerful automation capabilities.
|
||||
|
||||
## What is Shell Integration?
|
||||
|
||||
Shell integration is automatically enabled in Kilo Code and connects directly to your terminal's command execution lifecycle without requiring any setup from you. This built-in feature allows Kilo Code to:
|
||||
|
||||
- Execute commands on your behalf through the [`execute_command`](/features/tools/execute-command) tool
|
||||
- Read command output in real-time without manual copy-pasting
|
||||
- Automatically detect and fix errors in running applications
|
||||
- Observe command exit codes to determine success or failure
|
||||
- Track working directory changes as you navigate your project
|
||||
- React intelligently to terminal output without user intervention
|
||||
|
||||
When Kilo Code needs to perform tasks like installing dependencies, starting a development server, or analyzing build errors, shell integration works behind the scenes to make these interactions smooth and effective.
|
||||
|
||||
## Getting Started with Shell Integration
|
||||
|
||||
Shell integration is built into Kilo Code and works automatically in most cases. If you see "Shell Integration Unavailable" messages or experience issues with command execution, try these solutions:
|
||||
|
||||
1. **Update VSCode/Cursor** to the latest version (VSCode 1.93+ required)
|
||||
2. **Ensure a compatible shell is selected**: Command Palette (`Ctrl+Shift+P` or `Cmd+Shift+P`) → "Terminal: Select Default Profile" → Choose bash, zsh, PowerShell, or fish
|
||||
3. **Windows PowerShell users**: Run `Set-ExecutionPolicy RemoteSigned -Scope CurrentUser` then restart VSCode
|
||||
4. **WSL users**: Add `. "$(code --locate-shell-integration-path bash)"` to your `~/.bashrc`
|
||||
|
||||
## Terminal Integration Settings
|
||||
|
||||
Kilo Code provides several settings to fine-tune shell integration. Access these in the Kilo Code sidebar under Settings → Terminal.
|
||||
|
||||
### Basic Settings
|
||||
|
||||
#### Terminal Output Limit
|
||||
<img src="/docs/img/shell-integration/terminal-output-limit.png" alt="Terminal output limit slider set to 500" width="500" />
|
||||
Controls the maximum number of lines captured from terminal output. When exceeded, it keeps 20% of the beginning and 80% of the end with a truncation message in between. This prevents excessive token usage while maintaining context. Default: 500 lines.
|
||||
Controls the maximum number of lines captured from terminal output. When exceeded, lines are removed from the middle to save tokens. Default: 500 lines.
|
||||
|
||||
#### Terminal Shell Integration Timeout
|
||||
<img src="/docs/img/shell-integration/shell-integration-timeout.png" alt="Terminal shell integration timeout slider set to 15s" width="500" />
|
||||
|
||||
Maximum time to wait for shell integration to initialize before executing commands. Increase this value if you experience "Shell Integration Unavailable" errors. Default: 15 seconds.
|
||||
|
||||
#### Terminal Command Delay
|
||||
<img src="/docs/img/shell-integration/terminal-command-delay.png" alt="Terminal command delay slider set to 0ms" width="500" />
|
||||
|
||||
Adds a small pause after running commands to help Kilo Code capture all output correctly. This setting can significantly impact shell integration reliability due to VSCode's implementation of terminal integration across different operating systems and shell configurations:
|
||||
|
||||
- **Default**: 0ms
|
||||
- **Common Values**:
|
||||
* 0ms: Works best for some users with newer VSCode versions
|
||||
* 50ms: Historical default, still effective for many users
|
||||
* 150ms: Recommended for PowerShell users
|
||||
- **Note**: Different values may work better depending on your:
|
||||
* VSCode version
|
||||
* Shell customizations (oh-my-zsh, powerlevel10k, etc.)
|
||||
* Operating system and environment
|
||||
|
||||
### Advanced Settings
|
||||
|
||||
:::info Important
|
||||
**Terminal restart required for these settings**
|
||||
|
||||
Changes to advanced terminal settings only take effect after restarting your terminals. To restart a terminal:
|
||||
|
||||
1. Click the trash icon in the terminal panel to close the current terminal
|
||||
2. Open a new terminal with Terminal → New Terminal or <kbd>Ctrl</kbd>+<kbd>`</kbd> (backtick)
|
||||
|
||||
Always restart all open terminals after changing any of these settings.
|
||||
:::
|
||||
|
||||
#### PowerShell Counter Workaround
|
||||
<img src="/docs/img/shell-integration/power-shell-workaround.png" alt="PowerShell counter workaround checkbox" width="600" />
|
||||
|
||||
Helps PowerShell run the same command multiple times in a row. Enable this if you notice Kilo Code can't run identical commands consecutively in PowerShell.
|
||||
|
||||
#### Clear ZSH EOL Mark
|
||||
<img src="/docs/img/shell-integration/clear-zsh-eol-mark.png" alt="Clear ZSH EOL mark checkbox" width="600" />
|
||||
|
||||
Prevents ZSH from adding special characters at the end of output lines that can confuse Kilo Code when reading terminal results.
|
||||
|
||||
#### Oh My Zsh Integration
|
||||
<img src="/docs/img/shell-integration/oh-my-zsh.png" alt="Enable Oh My Zsh integration checkbox" width="600" />
|
||||
|
||||
Makes Kilo Code work better with the popular [Oh My Zsh](https://ohmyz.sh/) shell customization framework. Turn this on if you use Oh My Zsh and experience terminal issues.
|
||||
|
||||
#### Powerlevel10k Integration
|
||||
<img src="/docs/img/shell-integration/power10k.png" alt="Enable Powerlevel10k integration checkbox" width="600" />
|
||||
|
||||
Improves compatibility if you use the Powerlevel10k theme for ZSH. Turn this on if your fancy terminal prompt causes issues with Kilo Code.
|
||||
|
||||
#### ZDOTDIR Handling
|
||||
<img src="/docs/img/shell-integration/zdotdir.png" alt="Enable ZDOTDIR handling checkbox" width="600" />
|
||||
|
||||
Helps Kilo Code work with custom ZSH configurations without interfering with your personal shell settings and customizations.
|
||||
|
||||
## Troubleshooting Shell Integration
|
||||
|
||||
### PowerShell Execution Policy (Windows)
|
||||
|
||||
PowerShell restricts script execution by default. To configure:
|
||||
|
||||
1. Open PowerShell as Administrator
|
||||
2. Check current policy: `Get-ExecutionPolicy`
|
||||
3. Set appropriate policy: `Set-ExecutionPolicy RemoteSigned -Scope CurrentUser`
|
||||
|
||||
Common policies:
|
||||
- `Restricted`: No scripts allowed (default)
|
||||
- `RemoteSigned`: Local scripts can run; downloaded scripts need signing
|
||||
- `Unrestricted`: All scripts run with warnings
|
||||
- `AllSigned`: All scripts must be signed
|
||||
|
||||
### Manual Shell Integration Installation
|
||||
|
||||
If automatic integration fails, add the appropriate line to your shell configuration:
|
||||
|
||||
**Bash** (`~/.bashrc`):
|
||||
```bash
|
||||
[[ "$TERM_PROGRAM" == "vscode" ]] && . "$(code --locate-shell-integration-path bash)"
|
||||
```
|
||||
|
||||
**Zsh** (`~/.zshrc`):
|
||||
```bash
|
||||
[[ "$TERM_PROGRAM" == "vscode" ]] && . "$(code --locate-shell-integration-path zsh)"
|
||||
```
|
||||
|
||||
**PowerShell** (`$Profile`):
|
||||
```powershell
|
||||
if ($env:TERM_PROGRAM -eq "vscode") { . "$(code --locate-shell-integration-path pwsh)" }
|
||||
```
|
||||
|
||||
**Fish** (`~/.config/fish/config.fish`):
|
||||
```fish
|
||||
string match -q "$TERM_PROGRAM" "vscode"; and . (code --locate-shell-integration-path fish)
|
||||
```
|
||||
|
||||
### Terminal Customization Issues
|
||||
|
||||
If you use terminal customization tools:
|
||||
|
||||
**Powerlevel10k**:
|
||||
```bash
|
||||
# Add before sourcing powerlevel10k in ~/.zshrc
|
||||
typeset -g POWERLEVEL9K_TERM_SHELL_INTEGRATION=true
|
||||
```
|
||||
|
||||
**Alternative**: Enable the Powerlevel10k Integration setting in Kilo Code.
|
||||
|
||||
### Verifying Shell Integration Status
|
||||
|
||||
Confirm shell integration is active with these commands:
|
||||
|
||||
**Bash**:
|
||||
```bash
|
||||
set | grep -i '[16]33;'
|
||||
echo "$PROMPT_COMMAND" | grep vsc
|
||||
trap -p DEBUG | grep vsc
|
||||
```
|
||||
|
||||
**Zsh**:
|
||||
```zsh
|
||||
functions | grep -i vsc
|
||||
typeset -p precmd_functions preexec_functions
|
||||
```
|
||||
|
||||
**PowerShell**:
|
||||
```powershell
|
||||
Get-Command -Name "*VSC*" -CommandType Function
|
||||
Get-Content Function:\Prompt | Select-String "VSCode"
|
||||
```
|
||||
|
||||
**Fish**:
|
||||
```fish
|
||||
functions | grep -i vsc
|
||||
functions fish_prompt | grep -i vsc
|
||||
```
|
||||
|
||||
Visual indicators of active shell integration:
|
||||
1. Shell integration indicator in terminal title bar
|
||||
2. Command detection highlighting
|
||||
3. Working directory updates in terminal title
|
||||
4. Command duration and exit code reporting
|
||||
|
||||
## WSL Terminal Integration Methods
|
||||
|
||||
When using Windows Subsystem for Linux (WSL), there are two distinct ways to use VSCode with WSL, each with different implications for shell integration:
|
||||
|
||||
### Method 1: VSCode Windows with WSL Terminal
|
||||
|
||||
In this setup:
|
||||
- VSCode runs natively in Windows
|
||||
- You use the WSL terminal integration feature in VSCode
|
||||
- Shell commands are executed through the WSL bridge
|
||||
- May experience additional latency due to Windows-WSL communication
|
||||
- Shell integration markers may be affected by the WSL-Windows boundary: you must make sure that `source "$(code --locate-shell-integration-path <shell>)"` is loaded for your shell within the WSL environment because it may not get automatically loaded; see above.
|
||||
|
||||
### Method 2: VSCode Running Within WSL
|
||||
|
||||
In this setup:
|
||||
- You launch VSCode directly from within WSL using `code .`
|
||||
- VSCode server runs natively in the Linux environment
|
||||
- Direct access to Linux filesystem and tools
|
||||
- Better performance and reliability for shell integration
|
||||
- Shell integration is loaded automatically since VSCode runs natively in the Linux environment
|
||||
- Recommended approach for WSL development
|
||||
|
||||
For optimal shell integration with WSL, we recommend:
|
||||
1. Open your WSL distribution
|
||||
2. Navigate to your project directory
|
||||
3. Launch VSCode using `code .`
|
||||
4. Use the integrated terminal within VSCode
|
||||
|
||||
## Known Issues and Workarounds
|
||||
|
||||
### VS Code Shell Integration for Fish + Cygwin on Windows
|
||||
|
||||
For fellow Windows users running Fish terminal within a Cygwin environment, here's how VS Code's shell integration works:
|
||||
|
||||
1. **(Optional) Locate the Shell Integration Script:**
|
||||
Open your Fish terminal *within VS Code* and run the following command:
|
||||
```bash
|
||||
code --locate-shell-integration-path fish
|
||||
```
|
||||
This will output the path to the `shellIntegration.fish` script. Note down this path.
|
||||
|
||||
2. **Update Your Fish Configuration:**
|
||||
Edit your `config.fish` file (usually located at `~/.config/fish/config.fish` within your Cygwin home directory). Add the following line, preferably within an `if status is-interactive` block or at the very end of the file:
|
||||
|
||||
```fish
|
||||
# Example config.fish structure
|
||||
if status is-interactive
|
||||
# Your other interactive shell configurations...
|
||||
# automatic locate integration script:
|
||||
string match -q "$TERM_PROGRAM" "vscode"; and . (code --locate-shell-integration-path fish)
|
||||
|
||||
# Or if the above fails for you:
|
||||
# Source the VS Code shell integration script
|
||||
# IMPORTANT: Replace the example path below with the actual path you found in Step 1.
|
||||
# Make sure the path is in a format Cygwin can understand (e.g., using /cygdrive/c/...).
|
||||
# source "/cygdrive/c/Users/YourUser/.vscode/extensions/..../shellIntegration.fish"
|
||||
end
|
||||
```
|
||||
*Remember to replace the example path with the actual path from Step 1, correctly formatted for Cygwin.*
|
||||
|
||||
3. **Configure VS Code Terminal Profile:**
|
||||
Open your VS Code `settings.json` file (Ctrl+Shift+P -> "Preferences: Open User Settings (JSON)"). Update or add the Fish profile under `terminal.integrated.profiles.windows` like this:
|
||||
|
||||
```json
|
||||
{
|
||||
// ... other settings ...
|
||||
|
||||
"terminal.integrated.profiles.windows": {
|
||||
// ... other profiles ...
|
||||
|
||||
// Recommended: Use bash.exe to launch fish as a login shell
|
||||
"fish": {
|
||||
"path": "C:\\cygwin64\\bin\\bash.exe", // Or your Cygwin bash path
|
||||
"args": [
|
||||
"--login", // Ensures login scripts run (important for Cygwin environment)
|
||||
"-i", // Ensures bash runs interactively
|
||||
"-c",
|
||||
"exec fish" // Replace bash process with fish
|
||||
],
|
||||
"icon": "terminal-bash" // Optional: Use a recognizable icon
|
||||
}
|
||||
// Alternative (if the above fails): Launch fish directly
|
||||
"fish-direct": {
|
||||
"path": "C:\\cygwin64\\bin\\fish.exe", // Ensure this is in your Windows PATH or provide full path
|
||||
// Use 'options' here instead of 'args'; otherwise, you might encounter the error "terminal process terminated exit code 1".
|
||||
"options": ["-l", "-c"], // Example: login and interactive flags.
|
||||
"icon": "terminal-fish" // Optional: Use a fish icon
|
||||
}
|
||||
},
|
||||
|
||||
// Optional: Set fish as your default if desired
|
||||
// "terminal.integrated.defaultProfile.windows": "fish", // or "fish-direct" depending what you use.
|
||||
|
||||
// ... other settings ...
|
||||
}
|
||||
```
|
||||
*Note: Using `bash.exe --login -i -c "exec fish"` is often more reliable in Cygwin environments for ensuring the correct environment setup before `fish` starts. However, if that approach doesn't work, try the `fish-direct` profile configuration.*
|
||||
|
||||
4. **Restart VS Code:**
|
||||
Close and reopen Visual Studio Code completely to apply the changes.
|
||||
|
||||
5. **Verify:**
|
||||
Open a new Fish terminal in VS Code. The shell integration features (like command decorations, better command history navigation, etc.) should now be active. You can test basic functionality by running simple commands like `echo "Hello from integrated Fish!"`. <img src="/img/shell-integration/shell-integration-8.png" alt="Fish Cygwin Integration Example" width="600" />
|
||||
|
||||
This setup works reliably on Windows systems using Cygwin, Fish, and the Starship prompt, and should assist users with similar configurations.
|
||||
|
||||
|
||||
### Shell Integration Failures After VSCode 1.98
|
||||
|
||||
**Issue**: After VSCode updates beyond version 1.98, shell integration may fail with the error "VSCE output start escape sequence (]633;C or ]133;C) not received".
|
||||
|
||||
**Solutions**:
|
||||
1. **Set Terminal Command Delay**:
|
||||
- Set the Terminal Command Delay to 50ms in Kilo Code settings
|
||||
- Restart all terminals after changing this setting
|
||||
- This matches older default behavior and may resolve the issue, however some users have reported that a value of 0ms works better. This is a workaround for upstream VSCode problems.
|
||||
|
||||
2. **Roll Back VSCode Version**:
|
||||
- Download VSCode v1.98 from [VSCode Updates](https://code.visualstudio.com/updates/v1_98)
|
||||
- Replace your current VSCode installation
|
||||
- No backup of Kilo settings needed
|
||||
|
||||
3. **WSL-Specific Workaround**:
|
||||
- If using WSL, ensure you launch VSCode from within WSL using `code .`
|
||||
|
||||
4. **ZSH Users**:
|
||||
- Try enabling some or all ZSH-related workarounds in Kilo Code settings
|
||||
- These settings can help regardless of your operating system
|
||||
|
||||
## Known Issues and Workarounds
|
||||
|
||||
### Ctrl+C Behavior
|
||||
|
||||
**Issue**: If text is already typed in the terminal when Kilo Code tries to run a command, Kilo Code will press Ctrl+C first to clear the line, which can interrupt running processes.
|
||||
|
||||
**Workaround**: Make sure your terminal prompt is empty (no partial commands typed) before asking Kilo Code to execute terminal commands.
|
||||
|
||||
### Multi-line Command Issues
|
||||
|
||||
**Issue**: Commands that span multiple lines can confuse Kilo Code and may show output from previous commands mixed in with current output.
|
||||
|
||||
**Workaround**: Instead of multi-line commands, use command chaining with `&&` to keep everything on one line (e.g., `echo a && echo b` instead of typing each command on a separate line).
|
||||
|
||||
### PowerShell-Specific Issues
|
||||
|
||||
1. **Premature Completion**: PowerShell sometimes tells Kilo Code a command is finished before all the output has been shown.
|
||||
2. **Repeated Commands**: PowerShell may refuse to run the same command twice in a row.
|
||||
|
||||
**Workaround**: Enable the "PowerShell counter workaround" setting and set a terminal command delay of 150ms in the settings to give commands more time to complete.
|
||||
|
||||
### Incomplete Terminal Output
|
||||
|
||||
**Issue**: Sometimes VS Code doesn't show or capture all the output from a command.
|
||||
|
||||
**Workaround**: If you notice missing output, try closing and reopening the terminal tab, then run the command again. This refreshes the terminal connection.
|
||||
|
||||
## Troubleshooting Resources
|
||||
|
||||
### Checking Debug Logs
|
||||
When shell integration issues occur, check the debug logs:
|
||||
1. Open Help → Toggle Developer Tools → Console
|
||||
2. Set "Show All Levels" to see all log messages
|
||||
3. Look for messages containing `[Terminal Process]`
|
||||
4. Check `preOutput` content in error messages:
|
||||
- Empty preOutput (`''`) means VSCode sent no data
|
||||
- This indicates a potential VSCode shell integration issue, or an upstream bug that is out of our control
|
||||
- The absence of shell integration markers may require adjusting settings to work around possible upstream bugs or local workstation configuration issues related to shell initialization and VSCode's loading of special shell integration hooks
|
||||
|
||||
### Using the VSCode Terminal Integration Test Extension
|
||||
The [VSCode Terminal Integration Test Extension](https://github.com/KJ7LNW/vsce-test-terminal-integration) helps diagnose shell integration issues by testing different settings combinations:
|
||||
|
||||
|
||||
1. **When Commands Stall**:
|
||||
- If you see "command already running" warnings, click "Reset Stats" to reset the terminal state
|
||||
- These warnings indicate shell integration is not working
|
||||
- Try different settings combinations until you find one that works
|
||||
- If it really gets stuck, restart the extension by closing the window and pressing F5
|
||||
|
||||
2. **Testing Settings**:
|
||||
- Systematically try different combinations of:
|
||||
* Terminal Command Delay
|
||||
* Shell Integration settings
|
||||
- Document which combinations succeed or fail
|
||||
- This helps identify patterns in shell integration issues
|
||||
|
||||
3. **Reporting Issues**:
|
||||
- Once you find a problematic configuration
|
||||
- Document the exact settings combination
|
||||
- Note your environment (OS, VSCode version, shell, and any shell prompt customization)
|
||||
- Open an issue with these details to help improve shell integration
|
||||
|
||||
## Support
|
||||
|
||||
If you've followed these steps and are still experiencing problems, please:
|
||||
|
||||
1. Check the [Kilo Code GitHub Issues](https://github.com/Kilo-Org/kilocode/issues) to see if others have reported similar problems
|
||||
2. If not, create a new issue with details about your operating system, VSCode/Cursor version, and the steps you've tried
|
||||
|
||||
For additional help, join our [Discord](https://kilocode.ai/discord).
|
||||
@@ -1,45 +0,0 @@
|
||||
---
|
||||
sidebar_label: Suggested Responses
|
||||
---
|
||||
|
||||
import Codicon from '@site/src/components/Codicon';
|
||||
|
||||
# Suggested Responses
|
||||
|
||||
When Kilo Code needs more information to complete a task, it uses the [`ask_followup_question` tool](/features/tools/ask-followup-question). To make responding easier and faster, Kilo Code often provides suggested answers alongside the question.
|
||||
|
||||
## Overview
|
||||
|
||||
Suggested Responses appear as clickable buttons directly below Kilo Code's question in the chat interface. They offer pre-formulated answers relevant to the question, helping you provide input quickly.
|
||||
|
||||
<img src="/docs/img/suggested-responses/suggested-responses.png" alt="Example of Kilo Code asking a question with suggested response buttons below it" width="500" />
|
||||
|
||||
## How It Works
|
||||
|
||||
1. **Question Appears**: Kilo Code asks a question using the `ask_followup_question` tool.
|
||||
2. **Suggestions Displayed**: If suggestions are provided by Kilo Code, they appear as buttons below the question.
|
||||
3. **Interaction**: You can interact with these suggestions in two ways.
|
||||
|
||||
## Interacting with Suggestions
|
||||
|
||||
You have two options for using suggested responses:
|
||||
|
||||
1. **Direct Selection**:
|
||||
* **Action**: Simply click the button containing the answer you want to provide.
|
||||
* **Result**: The selected answer is immediately sent back to Kilo Code as your response. This is the quickest way to reply if one of the suggestions perfectly matches your intent.
|
||||
|
||||
2. **Edit Before Sending**:
|
||||
* **Action**:
|
||||
* Hold down `Shift` and click the suggestion button.
|
||||
* *Alternatively*, hover over the suggestion button and click the pencil icon (<Codicon name="edit" />) that appears.
|
||||
* **Result**: The text of the suggestion is copied into the chat input box. You can then modify the text as needed before pressing Enter to send your customized response. This is useful when a suggestion is close but needs minor adjustments.
|
||||
|
||||
<img src="/docs/img/suggested-responses/suggested-responses-1.png" alt="Chat input box showing text copied from a suggested response, ready for editing" width="600" />
|
||||
|
||||
## Benefits
|
||||
|
||||
* **Speed**: Quickly respond without typing full answers.
|
||||
* **Clarity**: Suggestions often clarify the type of information Kilo Code needs.
|
||||
* **Flexibility**: Edit suggestions to provide precise, customized answers when needed.
|
||||
|
||||
This feature streamlines the interaction when Kilo Code requires clarification, allowing you to guide the task effectively with minimal effort.
|
||||
@@ -1,246 +0,0 @@
|
||||
# Tool Use Overview
|
||||
|
||||
Kilo Code implements a sophisticated tool system that allows AI models to interact with your development environment in a controlled and secure manner. This document explains how tools work, when they're called, and how they're managed.
|
||||
|
||||
## Core Concepts
|
||||
|
||||
### Tool Groups
|
||||
|
||||
Tools are organized into logical groups based on their functionality:
|
||||
|
||||
| Category | Purpose | Tools | Common Use |
|
||||
|----------|---------|-------|------------|
|
||||
| **Read Group** | File system reading and searching | [read_file](/features/tools/read-file), [search_files](/features/tools/search-files), [list_files](/features/tools/list-files), [list_code_definition_names](/features/tools/list-code-definition-names) | Code exploration and analysis |
|
||||
| **Edit Group** | File system modifications | [apply_diff](/features/tools/apply-diff), [write_to_file](/features/tools/write-to-file) | Code changes and file manipulation |
|
||||
| **Browser Group** | Web automation | [browser_action](/features/tools/browser-action) | Web testing and interaction |
|
||||
| **Command Group** | System command execution | [execute_command](/features/tools/execute-command) | Running scripts, building projects |
|
||||
| **MCP Group** | External tool integration | [use_mcp_tool](/features/tools/use-mcp-tool), [access_mcp_resource](/features/tools/access-mcp-resource) | Specialized functionality through external servers |
|
||||
| **Workflow Group** | Mode and task management | [switch_mode](/features/tools/switch-mode), [new_task](/features/tools/new-task), [ask_followup_question](/features/tools/ask-followup-question), [attempt_completion](/features/tools/attempt-completion), [update_todo_list](/features/tools/update-todo-list) | Context switching and task organization |
|
||||
|
||||
### Always Available Tools
|
||||
|
||||
Certain tools are accessible regardless of the current mode:
|
||||
|
||||
- [ask_followup_question](/features/tools/ask-followup-question): Gather additional information from users
|
||||
- [attempt_completion](/features/tools/attempt-completion): Signal task completion
|
||||
- [switch_mode](/features/tools/switch-mode): Change operational modes
|
||||
- [new_task](/features/tools/new-task): Create subtasks
|
||||
- [update_todo_list](/features/tools/update-todo-list): Manage step-by-step task tracking
|
||||
|
||||
## Available Tools
|
||||
|
||||
### Read Tools
|
||||
These tools help Kilo Code understand your code and project:
|
||||
|
||||
- [read_file](/features/tools/read-file) - Examines the contents of files
|
||||
- [search_files](/features/tools/search-files) - Finds patterns across multiple files
|
||||
- [list_files](/features/tools/list-files) - Maps your project's file structure
|
||||
- [list_code_definition_names](/features/tools/list-code-definition-names) - Creates a structural map of your code
|
||||
|
||||
### Edit Tools
|
||||
These tools help Kilo Code make changes to your code:
|
||||
|
||||
- [apply_diff](/features/tools/apply-diff) - Makes precise, surgical changes to your code
|
||||
- [write_to_file](/features/tools/write-to-file) - Creates new files or completely rewrites existing ones
|
||||
|
||||
### Browser Tools
|
||||
These tools help Kilo Code interact with web applications:
|
||||
|
||||
- [browser_action](/features/tools/browser-action) - Automates browser interactions
|
||||
|
||||
### Command Tools
|
||||
These tools help Kilo Code execute commands:
|
||||
|
||||
- [execute_command](/features/tools/execute-command) - Runs system commands and programs
|
||||
|
||||
### MCP Tools
|
||||
These tools help Kilo Code connect with external services:
|
||||
|
||||
- [use_mcp_tool](/features/tools/use-mcp-tool) - Uses specialized external tools
|
||||
- [access_mcp_resource](/features/tools/access-mcp-resource) - Accesses external data sources
|
||||
|
||||
### Workflow Tools
|
||||
These tools help manage the conversation and task flow:
|
||||
|
||||
- [ask_followup_question](/features/tools/ask-followup-question) - Gets additional information from you
|
||||
- [attempt_completion](/features/tools/attempt-completion) - Presents final results
|
||||
- [switch_mode](/features/tools/switch-mode) - Changes to a different mode for specialized tasks
|
||||
- [new_task](/features/tools/new-task) - Creates a new subtask
|
||||
- [update_todo_list](/features/tools/update-todo-list) - Tracks task progress with step-by-step checklists
|
||||
|
||||
## Tool Calling Mechanism
|
||||
|
||||
### When Tools Are Called
|
||||
|
||||
Tools are invoked under specific conditions:
|
||||
|
||||
1. **Direct Task Requirements**
|
||||
- When specific actions are needed to complete a task as decided by the LLM
|
||||
- In response to user requests
|
||||
- During automated workflows
|
||||
|
||||
2. **Mode-Based Availability**
|
||||
- Different modes enable different tool sets
|
||||
- Mode switches can trigger tool availability changes
|
||||
- Some tools are restricted to specific modes
|
||||
|
||||
3. **Context-Dependent Calls**
|
||||
- Based on the current state of the workspace
|
||||
- In response to system events
|
||||
- During error handling and recovery
|
||||
|
||||
### Decision Process
|
||||
|
||||
The system uses a multi-step process to determine tool availability:
|
||||
|
||||
1. **Mode Validation**
|
||||
```typescript
|
||||
isToolAllowedForMode(
|
||||
tool: string,
|
||||
modeSlug: string,
|
||||
customModes: ModeConfig[],
|
||||
toolRequirements?: Record<string, boolean>,
|
||||
toolParams?: Record<string, any>
|
||||
)
|
||||
```
|
||||
|
||||
2. **Requirement Checking**
|
||||
- System capability verification
|
||||
- Resource availability
|
||||
- Permission validation
|
||||
|
||||
3. **Parameter Validation**
|
||||
- Required parameter presence
|
||||
- Parameter type checking
|
||||
- Value validation
|
||||
|
||||
## Technical Implementation
|
||||
|
||||
### Tool Call Processing
|
||||
|
||||
1. **Initialization**
|
||||
- Tool name and parameters are validated
|
||||
- Mode compatibility is checked
|
||||
- Requirements are verified
|
||||
|
||||
2. **Execution**
|
||||
```typescript
|
||||
const toolCall = {
|
||||
type: "tool_call",
|
||||
name: chunk.name,
|
||||
arguments: chunk.input,
|
||||
callId: chunk.callId
|
||||
}
|
||||
```
|
||||
|
||||
3. **Result Handling**
|
||||
- Success/failure determination
|
||||
- Result formatting
|
||||
- Error handling
|
||||
|
||||
### Security and Permissions
|
||||
|
||||
1. **Access Control**
|
||||
- File system restrictions
|
||||
- Command execution limitations
|
||||
- Network access controls
|
||||
|
||||
2. **Validation Layers**
|
||||
- Tool-specific validation
|
||||
- Mode-based restrictions
|
||||
- System-level checks
|
||||
|
||||
## Mode Integration
|
||||
|
||||
### Mode-Based Tool Access
|
||||
|
||||
Tools are made available based on the current mode:
|
||||
|
||||
- **Code Mode**: Full access to file system tools, code editing capabilities, command execution
|
||||
- **Ask Mode**: Limited to reading tools, information gathering capabilities, no file system modifications
|
||||
- **Architect Mode**: Design-focused tools, documentation capabilities, limited execution rights
|
||||
- **Custom Modes**: Can be configured with specific tool access for specialized workflows
|
||||
|
||||
### Mode Switching
|
||||
|
||||
1. **Process**
|
||||
- Current mode state preservation
|
||||
- Tool availability updates
|
||||
- Context switching
|
||||
|
||||
2. **Impact on Tools**
|
||||
- Tool set changes
|
||||
- Permission adjustments
|
||||
- Context preservation
|
||||
|
||||
## Best Practices
|
||||
|
||||
### Tool Usage Guidelines
|
||||
|
||||
1. **Efficiency**
|
||||
- Use the most specific tool for the task
|
||||
- Avoid redundant tool calls
|
||||
- Batch operations when possible
|
||||
|
||||
2. **Security**
|
||||
- Validate inputs before tool calls
|
||||
- Use minimum required permissions
|
||||
- Follow security best practices
|
||||
|
||||
3. **Error Handling**
|
||||
- Implement proper error checking
|
||||
- Provide meaningful error messages
|
||||
- Handle failures gracefully
|
||||
|
||||
### Common Patterns
|
||||
|
||||
1. **Information Gathering**
|
||||
```
|
||||
[ask_followup_question](/features/tools/ask-followup-question) → [read_file](/features/tools/read-file) → [search_files](/features/tools/search-files)
|
||||
```
|
||||
|
||||
2. **Code Modification**
|
||||
```
|
||||
[read_file](/features/tools/read-file) → [apply_diff](/features/tools/apply-diff) → [attempt_completion](/features/tools/attempt-completion)
|
||||
```
|
||||
|
||||
3. **Task Management**
|
||||
```
|
||||
[new_task](/features/tools/new-task) → [switch_mode](/features/tools/switch-mode) → [execute_command](/features/tools/execute-command)
|
||||
```
|
||||
|
||||
4. **Progress Tracking**
|
||||
```
|
||||
[update_todo_list](/features/tools/update-todo-list) → [execute_command](/features/tools/execute-command) → [update_todo_list](/features/tools/update-todo-list)
|
||||
```
|
||||
|
||||
## Error Handling and Recovery
|
||||
|
||||
### Error Types
|
||||
|
||||
1. **Tool-Specific Errors**
|
||||
- Parameter validation failures
|
||||
- Execution errors
|
||||
- Resource access issues
|
||||
|
||||
2. **System Errors**
|
||||
- Permission denied
|
||||
- Resource unavailable
|
||||
- Network failures
|
||||
|
||||
3. **Context Errors**
|
||||
- Invalid mode for tool
|
||||
- Missing requirements
|
||||
- State inconsistencies
|
||||
|
||||
### Recovery Strategies
|
||||
|
||||
1. **Automatic Recovery**
|
||||
- Retry mechanisms
|
||||
- Fallback options
|
||||
- State restoration
|
||||
|
||||
2. **User Intervention**
|
||||
- Error notifications
|
||||
- Recovery suggestions
|
||||
- Manual intervention options
|
||||
@@ -1,12 +0,0 @@
|
||||
# Core Concepts
|
||||
|
||||
Learn the key concepts used in Kilo Code
|
||||
|
||||
| Concept | Description | Video Preview |
|
||||
| -------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **Provider** | Kilo Code provides its own built-in API provider that gives you access to the latest frontier coding models without the need to manage API keys that offers access to frontier models such as: OpenAI (GPT-5), Anthropic (Claude), Google (Gemini), Meta (Llama) etc. | <video width="300" controls><source src="/docs/videos/Provider.mp4" type="video/mp4"/>Checkpoint reasoning demo showing concurrent file edits</video> |
|
||||
| **Foundational Models** | Large-scale AI models trained on vast datasets that serve as the base for AI applications. Models like GPT, Claude, LLaMA provide core language understanding and generation capabilities. | <video width="300" controls><source src="/docs/videos/Models.mp4" type="video/mp4"/>Foundation model</video> |
|
||||
| **Prompt Engineering** | Art and science of crafting effective inputs for AI models to achieve desired outputs. Use enhance button to improve your prompt | <video width="300" controls><source src="/docs/videos/Prompt.mp4" type="video/mp4"/></video> |
|
||||
| **Modes** | Within Kilo Code you can choose **Architect** mode to plan and design you software, **Code** mode to write and refactor code, **Ask** to understand your codebase, **Debug** to fix software issues and **Orchestrator** to coordinate tasks accross modes | <video width="300" controls><source src="/docs/videos/Modes.mp4" type="video/mp4"/></video> |
|
||||
| **Codebase Indexing** | Codebase Indexing enables semantic code search across your entire project using AI embeddings. | <video width="300" controls><source src="/docs/videos/Indexing.mp4"/>Codebase structure mapping and navigation</video> |
|
||||
| **MCP (Model Context Protocol)** | Standardized protocol for managing context and communication between AI models and external systems. Enables seamless integration with tools, databases, and services. | <video width="300" controls><source src="/docs/videos/MCP.mp4" type="video/mp4"/>MCP demo</video> |
|
||||
@@ -1,86 +0,0 @@
|
||||
---
|
||||
sidebar_label: Connecting To A Provider
|
||||
---
|
||||
|
||||
# Connecting an AI Provider
|
||||
|
||||
Kilo Code requires an API key from an AI model provider to function.
|
||||
|
||||
We recommend these options for accessing the powerful **Claude 4 Sonnet** model:
|
||||
|
||||
- **Kilo Code API provider (Recommended):** Provides access to all of the models available through OpenRouter with competitive pricing and free credits to get started. [View pricing](https://kilocode.ai/pricing)
|
||||
- **OpenRouter:** Provides access to multiple AI models through a single API key. [View pricing](https://openrouter.ai/models?order=pricing-low-to-high).
|
||||
- **Anthropic:** Direct access to Claude models. Requires API access approval and may have [rate limits depending on your tier](https://docs.anthropic.com/en/api/rate-limits#requirements-to-advance-tier). See [Anthropic's pricing page](https://www.anthropic.com/pricing#anthropic-api) for details.
|
||||
|
||||
## Using the Kilo Code Provider
|
||||
By default when you install Kilo Code the extension, you'll be prompted to sign in or create an account in the [Kilo Code Provider](/providers/kilocode).
|
||||
|
||||
That will walk you through the account setup and _automatically_ configure Kilo Code properly to get you started. If you'd rather use another provider, you'll need to manually get your API key as described below.
|
||||
|
||||
## Using another API Provider
|
||||
|
||||
### Getting Your API Key
|
||||
|
||||
#### Option 1: LLM Routers
|
||||
|
||||
LLM routers let you access multiple AI models with one API key, simplifying cost management and switching between models. They often offer [competitive pricing](https://openrouter.ai/models?order=pricing-low-to-high) compared to direct providers.
|
||||
|
||||
##### OpenRouter
|
||||
|
||||
1. Go to [openrouter.ai](https://openrouter.ai/)
|
||||
2. Sign in with your Google or GitHub account
|
||||
3. Navigate to the [API keys page](https://openrouter.ai/keys) and create a new key
|
||||
4. Copy your API key - you'll need this for Kilo Code setup
|
||||
|
||||
<img src="/docs/img/connecting-api-provider/connecting-api-provider-4.png" alt="OpenRouter API keys page" width="600" />
|
||||
|
||||
*OpenRouter dashboard with "Create key" button. Name your key and copy it after creation.*
|
||||
|
||||
##### Requesty
|
||||
|
||||
1. Go to [requesty.ai](https://requesty.ai/)
|
||||
2. Sign in with your Google account or email
|
||||
3. Navigate to the [API management page](https://app.requesty.ai/manage-api) and create a new key
|
||||
4. **Important:** Copy your API key immediately as it won't be displayed again
|
||||
|
||||
<img src="/docs/img/connecting-api-provider/connecting-api-provider-7.png" alt="Requesty API management page" width="600" />
|
||||
|
||||
*Requesty API management page with "Create API Key" button. Copy your key immediately - it's shown only once.*
|
||||
|
||||
#### Option 2: Direct Providers
|
||||
|
||||
For direct access to specific models from their original providers, with full access to their features and capabilities:
|
||||
|
||||
##### Anthropic
|
||||
|
||||
1. Go to [console.anthropic.com](https://console.anthropic.com/)
|
||||
2. Sign up for an account or log in
|
||||
3. Navigate to the [API keys section](https://console.anthropic.com/settings/keys) and create a new key
|
||||
4. **Important:** Copy your API key immediately as it won't be displayed again
|
||||
|
||||
<img src="/docs/img/connecting-api-provider/connecting-api-provider-5.png" alt="Anthropic console API Keys section" width="600" />
|
||||
|
||||
*Anthropic console API Keys section with "Create key" button. Name your key, set expiration, and copy it immediately.*
|
||||
|
||||
##### OpenAI
|
||||
|
||||
1. Go to [platform.openai.com](https://platform.openai.com/)
|
||||
2. Sign up for an account or log in
|
||||
3. Navigate to the [API keys section](https://platform.openai.com/api-keys) and create a new key
|
||||
4. **Important:** Copy your API key immediately as it won't be displayed again
|
||||
|
||||
<img src="/docs/img/connecting-api-provider/connecting-api-provider-6.png" alt="OpenAI API keys page" width="600" />
|
||||
|
||||
*OpenAI platform with "Create new secret key" button. Name your key and copy it immediately after creation.*
|
||||
|
||||
### Configuring the Provider in Kilo Code
|
||||
|
||||
Once you have your API key:
|
||||
|
||||
1. Open the Kilo Code sidebar by clicking the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in the VS Code Side Bar
|
||||
2. In the welcome screen, select your API provider from the dropdown
|
||||
3. Paste your API key into the appropriate field
|
||||
4. Select your model:
|
||||
- For **OpenRouter**: select `anthropic/claude-3.7-sonnet` ([model details](https://openrouter.ai/anthropic/claude-3.7-sonnet))
|
||||
- For **Anthropic**: select `claude-3-7-sonnet-20250219` ([model details](https://www.anthropic.com/pricing#anthropic-api))
|
||||
5. Click "Let's go!" to save your settings and start using Kilo Code
|
||||
@@ -1,108 +0,0 @@
|
||||
---
|
||||
sidebar_label: Installing Kilo Code
|
||||
---
|
||||
|
||||
# Installing Kilo Code
|
||||
|
||||
Kilo Code is a VS Code extension that brings AI-powered coding assistance directly to your editor. Install using one of these methods:
|
||||
- [**VS Code Marketplace (Recommended)**](#vs-code-marketplace) - fastest method for standard VS Code users
|
||||
- [**Cursor Marketplace**](#cursor-marketplace) - recommended way for Cursor users
|
||||
- [**Open VSX Registry**](#open-vsx-registry) - for VS Code-compatible editors like VSCodium or Windsurf
|
||||
- [**Manually install the .vsix file**](#manual-installation-from-vsix) - direct installation from the GitHub Release
|
||||
|
||||
## VS Code Marketplace
|
||||
|
||||
:::tip
|
||||
|
||||
If you already have VS Code installed: [Click here to install Kilo Code](vscode:extension/kilocode.Kilo-Code)
|
||||
|
||||
:::
|
||||
|
||||
alternatively, you can:
|
||||
|
||||
1. Open VS Code
|
||||
2. Access Extensions: Click the Extensions icon in the Side Bar or press `Ctrl+Shift+X` (Windows/Linux) or `Cmd+Shift+X` (macOS)
|
||||
3. Search for "Kilo Code"
|
||||
4. Select "Kilo Code" by Kilo Code and click **Install**
|
||||
5. Reload VS Code if prompted
|
||||
|
||||
After installation, find the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in the Side Bar to open the Kilo Code panel.
|
||||
|
||||
<img src="/docs/img/installing/installing.png" alt="VS Code marketplace with Kilo Code extension ready to install" width="400" />
|
||||
*VS Code marketplace with Kilo Code extension ready to install*
|
||||
|
||||
## Cursor Marketplace
|
||||
|
||||
:::tip
|
||||
|
||||
If you already have Cursor installed: [Click here to install Kilo Code](cursor:extension/kilocode.Kilo-Code)
|
||||
|
||||
:::
|
||||
|
||||
alternatively, you can:
|
||||
|
||||
1. Open Cursor
|
||||
2. Access Extensions: Click the Extensions icon in the Side Bar or press `Ctrl+Shift+X` (Windows/Linux) or `Cmd+Shift+X` (macOS)
|
||||
3. Search for "Kilo Code"
|
||||
4. Select "Kilo Code" by Kilo Code and click **Install**
|
||||
5. Reload Cursor if prompted
|
||||
|
||||
After installation, find the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in the Side Bar to open the Kilo Code panel.
|
||||
|
||||
|
||||
|
||||
## Open VSX Registry
|
||||
|
||||
[Open VSX Registry](https://open-vsx.org/) is an open-source alternative to the VS Code Marketplace for VS Code-compatible editors that cannot access the official marketplace due to licensing restrictions.
|
||||
|
||||
For VS Code-compatible editors like VSCodium, Gitpod, Eclipse Theia, and Windsurf, you can browse and install directly from the [Kilo Code page on Open VSX Registry](https://open-vsx.org/extension/kilocode/Kilo-Code).
|
||||
|
||||
1. Open your editor
|
||||
2. Access the Extensions view (Side Bar icon or `Ctrl+Shift+X` / `Cmd+Shift+X`)
|
||||
3. Your editor should be pre-configured to use Open VSX Registry
|
||||
4. Search for "Kilo Code"
|
||||
5. Select "Kilo Code" and click **Install**
|
||||
6. Reload the editor if prompted
|
||||
|
||||
:::note
|
||||
If your editor isn't automatically configured for Open VSX Registry, you may need to set it as your extension marketplace in settings. Consult your specific editor's documentation for instructions.
|
||||
:::
|
||||
|
||||
## Manual Installation from VSIX
|
||||
|
||||
If you prefer to download and install the VSIX file directly:
|
||||
|
||||
1. **Download the VSIX file:**
|
||||
* Find official releases on the [Kilo Code GitHub Releases page](https://github.com/Kilo-Org/kilocode/releases)
|
||||
* Download the `.vsix` file from the [latest release](https://github.com/Kilo-Org/kilocode/releases/latest)
|
||||
|
||||
2. **Install in VS Code:**
|
||||
* Open VS Code
|
||||
* Access Extensions view
|
||||
* Click the "..." menu in the Extensions view
|
||||
* Select "Install from VSIX..."
|
||||
* Browse to and select your downloaded `.vsix` file
|
||||
|
||||
<img src="/docs/img/installing/installing-2.png" alt="VS Code's Install from VSIX dialog" width="400" />
|
||||
*Installing Kilo Code using VS Code's "Install from VSIX" dialog*
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
**Extension Not Visible**
|
||||
* Restart VS Code
|
||||
* Verify Kilo Code is listed and enabled in Extensions
|
||||
* Try disabling and re-enabling the extension in Extensions
|
||||
* Check Output panel for errors (View → Output, select "Kilo Code")
|
||||
|
||||
**Installation Problems**
|
||||
* Ensure stable internet connection
|
||||
* Verify VS Code version 1.84.0 or later
|
||||
* If VS Code Marketplace is inaccessible, try the Open VSX Registry method
|
||||
|
||||
## Getting Support
|
||||
|
||||
If you encounter issues not covered here:
|
||||
|
||||
* Join our [Discord community](https://kilocode.ai/discord) for real-time support
|
||||
* Submit issues on [GitHub](https://github.com/Kilo-Org/kilocode/issues)
|
||||
* Visit our [Reddit community](https://www.reddit.com/r/KiloCode)
|
||||
@@ -1,37 +0,0 @@
|
||||
---
|
||||
sidebar_label: Getting Set up
|
||||
---
|
||||
|
||||
import { DISCORD_URL } from "@site/src/constants.ts";
|
||||
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
|
||||
|
||||
# Setting up Kilo Code
|
||||
|
||||
When you sign up for Kilo Code, you can start immediately with free models, or top up your account for the first time to get bonus credits.
|
||||
|
||||
To claim your bonus credits:
|
||||
|
||||
1. **Sign up:** Complete the registration process
|
||||
2. **First top-up:** Add funds to your account and get $20 bonus credits
|
||||
3. **Start Coding:** Enjoy your $20 in free credits
|
||||
|
||||
## Registration process
|
||||
|
||||
Kilo Code provides a simple registration process that gives you access to the latest frontier coding models with your Kilo Code login.
|
||||
|
||||
1. Click on "Try Kilo Code for Free" in the extension
|
||||
1. Sign in with your Google account to kilocode.ai
|
||||
1. kilocode.ai will prompt you to open Visual Studio Code
|
||||
- When using an IDE in a web browser, you will be asked to copy the API key manually instead
|
||||
1. Once you allow it to Open VS Code, you must also allow VS Code to open the authorization URL
|
||||
|
||||
<img
|
||||
src="/docs/img/setting-up/signupflow.gif"
|
||||
alt="Sign up and registration flow with Kilo Code"
|
||||
/>
|
||||
|
||||
That's it - you're all set! Now you can start with [your first task](/getting-started/your-first-task)
|
||||
|
||||
:::tip Need Help?
|
||||
If you have any questions about pricing or tokens, please reach out to our [support team](mailto:hi@kilocode.ai) or ask in our <a href={DISCORD_URL} target='_blank'>Discord community</a>.
|
||||
:::
|
||||
@@ -0,0 +1,315 @@
|
||||
---
|
||||
sidebar_label: Switching from Cline
|
||||
---
|
||||
|
||||
# Migrating from Cline to Kilo
|
||||
|
||||
A practical guide for developers switching from Cline to Kilo.
|
||||
|
||||
## Why Switch?
|
||||
|
||||
**Speed.** The Kilo Platform is designed to reduce friction across the entire development workflow. Beyond feature parity with Cline, Kilo includes Code Reviews, App Builder, Cloud Agents, and one-click Deploy.
|
||||
|
||||
**Multi-platform.** Work in VS Code, JetBrains IDEs, CLI, or the web. Your Sessions sync across all of them automatically.
|
||||
|
||||
**Specialized modes.** Instead of one agent doing everything, Kilo has five specialized modes optimized for different parts of your workflow.
|
||||
|
||||
**500+ models.** More providers, more options, better pricing flexibility. Switch models mid-conversation if you want.
|
||||
|
||||
---
|
||||
|
||||
## Understanding Kilo's Mode System
|
||||
|
||||
Cline uses a single agent with a Plan/Act toggle. Kilo takes a different approach: five specialized modes, each optimized for a specific part of development. You select modes from a dropdown in the interface in the Kilo Extension, or with slash commands in the CLI.
|
||||
|
||||
### Kilo's Five Modes
|
||||
|
||||
#### Code Mode (default)
|
||||
|
||||
- **What it does:** Implementation and refactoring
|
||||
- **Cline equivalent:** Act mode
|
||||
- **When to use:** Writing features, fixing bugs, making changes
|
||||
- **Example:** "Add user authentication to the API"
|
||||
|
||||
#### Ask Mode
|
||||
|
||||
- **What it does:** Answers questions, explains code
|
||||
- **Cline equivalent:** Plan mode (read-only exploration)
|
||||
- **When to use:** Understanding codebases, learning patterns
|
||||
- **Example:** "How does our caching layer work?"
|
||||
|
||||
#### Debug Mode
|
||||
|
||||
- **What it does:** Systematic troubleshooting and error diagnosis
|
||||
- **Cline equivalent:** Act mode focused on debugging
|
||||
- **When to use:** Tracking down bugs, fixing runtime issues
|
||||
- **Example:** "Why is this API endpoint returning 500?"
|
||||
|
||||
#### Architect Mode
|
||||
|
||||
- **What it does:** Planning, design, and technical leadership
|
||||
- **Cline equivalent:** Plan mode (exploration and planning)
|
||||
- **When to use:** Before complex refactors, designing new systems
|
||||
- **Example:** "Design a caching strategy for our API"
|
||||
|
||||
#### Orchestrator Mode
|
||||
|
||||
- **What it does:** Breaks down complex tasks, coordinates other modes
|
||||
- **Cline equivalent:** Complex multi-step workflows
|
||||
- **When to use:** Large features spanning multiple systems
|
||||
- **Example:** "Build a complete user management system"
|
||||
|
||||
### Mode Switching in Action
|
||||
|
||||
**Cline workflow:** Toggle Plan/Act → Submit task → Plan phase → Approve → Act phase → Checkpoint
|
||||
|
||||
**Kilo workflow:**
|
||||
Select mode from dropdown → Build → Switch modes as needed → Checkpoint → Session auto-saves
|
||||
|
||||
Or
|
||||
|
||||
Select Orchestrator mode → autonomously define subtasks → intelligently distribute subtasks across modes
|
||||
|
||||
#### Example: Refactoring authentication
|
||||
|
||||
**Cline:**
|
||||
|
||||
1. Enable Plan/Act mode
|
||||
2. "Refactor auth to use OAuth2"
|
||||
3. Wait for plan → Review → Approve
|
||||
4. Watch step-by-step execution
|
||||
5. Checkpoint when done
|
||||
|
||||
**Kilo:**
|
||||
|
||||
1. Select **Orchestrator** from the mode dropdown
|
||||
2. "Implement OAuth2 refactor for our authentication"
|
||||
3. Orchestrator creates subtasks for other modes automatically
|
||||
4. **Architect Mode** reviews the architecture
|
||||
5. **Code Mode** implements the OAuth2 client
|
||||
6. Session/checkpoints preserved automatically
|
||||
|
||||
#### Example: Understanding unfamiliar code
|
||||
|
||||
**Cline:** Use Plan mode (but risk accidentally switching to Act)
|
||||
|
||||
**Kilo:** Select **Ask** from the dropdown
|
||||
|
||||
- "Explain how the payment processing flow works"
|
||||
- "What external services does this integrate with?"
|
||||
- Ask mode never writes files, so exploration is always safe
|
||||
|
||||
**Why this matters:** In Cline, you might accidentally make changes while exploring. In Kilo, Ask and Architect modes can't write files, so you're safe to explore without worry. Kilo's **Orchestrator** mode lets you intelligently generate and execute subtasks that are optimized for each mode.
|
||||
|
||||
---
|
||||
|
||||
## Installation
|
||||
|
||||
### VS Code / Cursor
|
||||
|
||||
1. Open Extensions (`Cmd/Ctrl + Shift + X`)
|
||||
2. Search "Kilo Code"
|
||||
3. Click Install
|
||||
4. Find the Kilo icon in your sidebar
|
||||
|
||||
### JetBrains IDEs
|
||||
|
||||
Supports IntelliJ, PyCharm, WebStorm, and all JetBrains IDEs.
|
||||
|
||||
**Prerequisites:**
|
||||
|
||||
- JetBrains Toolbox (required for auth)
|
||||
- Node.js LTS
|
||||
|
||||
**Install:**
|
||||
|
||||
1. Settings → Plugins → Marketplace
|
||||
2. Search "Kilo Code"
|
||||
3. Install and restart
|
||||
4. Find Kilo icon in right sidebar
|
||||
|
||||
### CLI
|
||||
|
||||
```shell
|
||||
npm install -g @kilocode/cli
|
||||
kilo
|
||||
```
|
||||
|
||||
### Web (Cloud Agents & App Builder)
|
||||
|
||||
Visit [app.kilo.ai](https://app.kilo.ai/) and sign in. This gives you access to:
|
||||
|
||||
- **Cloud Agents:** Run Kilo without a local machine
|
||||
- **App Builder:** Build and preview apps directly in your browser
|
||||
- **Kilo Deploy:** One-click deployments
|
||||
- **Code Reviews:** AI-powered PR analysis
|
||||
|
||||
---
|
||||
|
||||
## Initial Setup
|
||||
|
||||
### Create account
|
||||
|
||||
1. Click "Try Kilo Code for Free" in the Kilo panel
|
||||
2. Sign in with OAuth at kilo.ai
|
||||
3. You'll be redirected back to your IDE
|
||||
|
||||
### Configure your provider
|
||||
|
||||
**Option 1: Use Kilo Gateway (easiest)**
|
||||
|
||||
1. Open settings (⚙️ icon)
|
||||
2. Select "Kilo Gateway" as provider
|
||||
3. Choose a model (such as Claude Opus 4.5, Gemini 3, MiniMax M2.1)
|
||||
|
||||
**Option 2: Bring your own API keys**
|
||||
|
||||
1. Select your provider (Anthropic, OpenAI, etc.)
|
||||
2. Enter your API key
|
||||
3. Choose your model
|
||||
|
||||
---
|
||||
|
||||
## Beyond the IDE: Kilo's Platform Features
|
||||
|
||||
One of the biggest differences from Cline is that Kilo isn't just an IDE extension. It's a platform with multiple interfaces that can all share your Sessions and context.
|
||||
|
||||
### Cloud Agents
|
||||
|
||||
Run Kilo from [app.kilo.ai/cloud](https://app.kilo.ai/cloud) without needing your local machine. Great for:
|
||||
|
||||
- Working from a tablet or phone
|
||||
- Offloading heavy tasks
|
||||
- Parallel execution without blocking your IDE
|
||||
|
||||
### Parallel Agents
|
||||
|
||||
Run multiple agents simultaneously without conflicts, in both the IDE and CLI. Start an agent working on tests while another handles documentation.
|
||||
|
||||
### Sessions
|
||||
|
||||
Your conversation history, context, and state sync across all interfaces automatically. Start a task in the CLI, continue in VS Code, check progress on mobile.
|
||||
|
||||
### App Builder
|
||||
|
||||
Build live apps and sites directly from the web with a real-time preview. Similar to Lovable, but integrated with your Kilo Sessions. Deploy with one click when you're ready.
|
||||
|
||||
### Kilo Deploy
|
||||
|
||||
One-click deployments from directly within Kilo. Go from code to production without leaving your workflow.
|
||||
|
||||
### Code Reviews
|
||||
|
||||
Automatically analyzes your PRs using your choice of AI model. Reviews happen the moment a PR is opened or updated, covering performance, security, style, and test coverage.
|
||||
|
||||
### Managed Indexing
|
||||
|
||||
Semantic search across your repositories using cloud-hosted embeddings. Kilo indexes your codebase to deliver more relevant, context-aware responses.
|
||||
|
||||
### Autocomplete
|
||||
|
||||
In-line ghost-text completions with tab to complete. Works alongside the agent modes for a complete coding experience.
|
||||
|
||||
---
|
||||
|
||||
## Complete Development Workflows
|
||||
|
||||
### New Feature Development
|
||||
|
||||
**Kilo approach:**
|
||||
|
||||
1. **Architect mode:** "Design a user notification system"
|
||||
2. Review architecture, discuss trade-offs
|
||||
3. **Code mode:** "Implement the notification service"
|
||||
4. Fast Apply builds it quickly
|
||||
5. **Debug mode:** "Email sends aren't working"
|
||||
6. Fix issues
|
||||
7. Session auto-saves as "Notifications-Complete"
|
||||
|
||||
### Debugging Production Issues
|
||||
|
||||
**Kilo approach:**
|
||||
|
||||
1. **Debug mode:** "Checkout fails with 'payment_intent_not_found'"
|
||||
2. Debug mode systematically checks logs, traces API calls
|
||||
3. **Code mode:** "Add idempotency key to prevent duplicates"
|
||||
4. Verify fix
|
||||
|
||||
### Large Refactoring
|
||||
|
||||
**Kilo approach:**
|
||||
|
||||
1. **Ask mode:** "Explain our current auth implementation"
|
||||
2. **Architect mode:** "Design migration to JWT tokens"
|
||||
3. Session saves as "Auth-Refactor-Plan"
|
||||
4. **Code mode:** Implement JWT generation, update middleware
|
||||
5. **Debug mode:** Fix failing tests
|
||||
|
||||
### Learning Unfamiliar Code
|
||||
|
||||
**Kilo approach:**
|
||||
|
||||
1. **Ask mode:** "Explain how payment processing works"
|
||||
2. "What happens when a payment fails?"
|
||||
3. "Show me the retry logic"
|
||||
4. Ask mode never writes, so exploration is completely safe
|
||||
5. When ready, switch to **Code mode** to make changes
|
||||
|
||||
---
|
||||
|
||||
## Feature Mapping
|
||||
|
||||
| Cline Feature | Kilo Equivalent | Notes |
|
||||
| ------------------ | ---------------------------------- | ------------------------------------------------------------------------------- |
|
||||
| Plan mode | Orchestrator, Architect, Ask modes | Architect plans, Ask explains, Orchestrate distributes tasks across other modes |
|
||||
| Act mode | Code mode | Implementation |
|
||||
| Plan/Act toggle | Mode dropdown | More granular control |
|
||||
| Checkpoints | Sessions + Checkpoints | Sessions preserve mode + context |
|
||||
| Background editing | Fast Apply | Sequential but instant |
|
||||
| Single agent | Five specialized modes | Purpose-built for each task |
|
||||
| Local only | Multi-platform | IDE, CLI, web, mobile |
|
||||
|
||||
---
|
||||
|
||||
## What You Gain
|
||||
|
||||
- **Specialized modes:** Purpose-built for different parts of development
|
||||
- **Fast Apply:** 5-10x faster code application
|
||||
- **Autocomplete:** Inline AI suggestions
|
||||
- **Multi-platform:** VS Code, JetBrains, CLI, web
|
||||
- **Session Persistance:** Sessions preserve mode + context across devices
|
||||
- **500+ models:** More provider options, switch anytime
|
||||
- **Cloud Agents:** Work without your local machine
|
||||
- **App Builder:** Build and preview apps in the browser
|
||||
- **One-click Deploy:** Ship directly from Kilo
|
||||
- **Code Reviews:** AI-powered PR analysis
|
||||
- **Parallel Agents:** Run multiple agents simultaneously
|
||||
|
||||
---
|
||||
|
||||
## Common Questions
|
||||
|
||||
**Q: Do I have to switch modes constantly?** No. Orchestrator does that automatically. Code mode handles most day-to-day work. Switch when you need specialized behavior.
|
||||
|
||||
**Q: What if I forget to switch modes?** Code mode is the default and handles most tasks. It'll still work, just might not be optimized for exploration or planning.
|
||||
|
||||
**Q: Can I customize what each mode does?** Yes. Add mode-specific instructions in settings, or create custom modes.
|
||||
|
||||
**Q: Can I use both Cline and Kilo side-by-side?** Yes. They're separate extensions.
|
||||
|
||||
**Q: What's the difference between Cloud Agents and the IDE extension?** Same capabilities, different interface. Cloud Agents run in the browser, so you can work from any device without your local machine.
|
||||
|
||||
---
|
||||
|
||||
## Next Steps
|
||||
|
||||
1. Install Kilo in your primary IDE
|
||||
2. Try each mode with a small task:
|
||||
- **Code:** "Add a hello world endpoint"
|
||||
- **Ask:** "Explain what this file does"
|
||||
- **Debug:** "Why is this function returning undefined?"
|
||||
- **Architect:** "Design a logging system"
|
||||
- **Orchestrator:** "Build an app, end-to-end, that…"
|
||||
3. Try Cloud Agents at [app.kilo.ai](https://app.kilo.ai/)
|
||||
4. Install the Kilo CLI with `npm install -g @kilocode/cli`
|
||||
5. Enable Autocomplete for inline suggestions
|
||||
@@ -1,79 +0,0 @@
|
||||
---
|
||||
sidebar_label: Your First Task
|
||||
---
|
||||
|
||||
# Starting Your First Task with Kilo Code
|
||||
|
||||
<YouTubeEmbed
|
||||
url="https://www.youtube.com/watch?v=pO7zRLQS-p0"
|
||||
/>
|
||||
|
||||
This quick tour shows how Kilo Code handles a simple request from start to finish.
|
||||
|
||||
After you [set up Kilo Code](/getting-started/setting-up), follow these steps:
|
||||
|
||||
## Step 1: Open the Kilo Code Panel
|
||||
|
||||
Click the Kilo Code icon (<img src="/docs/img/kilo-v1.svg" width="12" />) in the VS Code Primary Side Bar (vertical bar on the side of the window) to open the chat interface. If you don't see the icon, verify the extension is [installed](/getting-started/installing) and enabled.
|
||||
|
||||
<img src="/docs/img/your-first-task/your-first-task.png" alt="Kilo Code icon in VS Code Primary Side Bar" width="800" />
|
||||
|
||||
*The Kilo Code icon in the Primary Side Bar opens the chat interface.*
|
||||
|
||||
## Step 2: Type Your Task
|
||||
|
||||
Type a clear, concise description of what you want Kilo Code to do in the chat box at the bottom of the panel. Examples of effective tasks:
|
||||
|
||||
* "Create a file named `hello.txt` containing 'Hello, world!'."
|
||||
* "Write a Python function that adds two numbers."
|
||||
* "Create an HTML file for a simple website with the title 'Kilo test'"
|
||||
|
||||
No special commands or syntax needed—just use plain English.
|
||||
|
||||
<img src="/docs/img/your-first-task/your-first-task-6.png" alt="Typing a task in the Kilo Code chat interface" width="500" />
|
||||
*Enter your task in natural language - no special syntax required.*
|
||||
|
||||
## Step 3: Send Your Task
|
||||
|
||||
Press Enter or click the Send icon (<Codicon name="send" />) to the right of the input box.
|
||||
|
||||
## Step 4: Review and Approve Actions
|
||||
|
||||
Kilo Code analyzes your request and proposes specific actions. These may include:
|
||||
|
||||
* **Reading files:** Shows file contents it needs to access
|
||||
* **Writing to files:** Displays a diff with proposed changes (added lines in green, removed in red)
|
||||
* **Executing commands:** Shows the exact command to run in your terminal
|
||||
* **Using the Browser:** Outlines browser actions (click, type, etc.)
|
||||
* **Asking questions:** Requests clarification when needed to proceed
|
||||
|
||||
<img src="/docs/img/your-first-task/your-first-task-7.png" alt="Reviewing a proposed file creation action" width="400" />
|
||||
*Kilo Code shows exactly what action it wants to perform and waits for your approval.*
|
||||
|
||||
* In **Code** mode, writing capabilities are on by default.
|
||||
* In **Architect** and **Ask** modes, Kilo Code won't write code.
|
||||
|
||||
:::tip
|
||||
|
||||
The level of autonomy is configurable, allowing you to make the agent more or less autonomous.
|
||||
|
||||
You can learn more about [using modes](/basic-usage/using-modes) and [auto-approving actions](/features/auto-approving-actions).
|
||||
|
||||
:::
|
||||
|
||||
## Step 5: Iterate
|
||||
|
||||
Kilo Code works iteratively. After each action, it waits for your feedback before proposing the next step. Continue this review-approve cycle until your task is complete.
|
||||
|
||||
<img src="/docs/img/your-first-task/your-first-task-8.png" alt="Final result of a completed task showing the iteration process" width="500" />
|
||||
*After completing the task, Kilo Code shows the final result and awaits your next instruction.*
|
||||
|
||||
## Conclusion
|
||||
|
||||
You've completed your first task. Along the way you learned:
|
||||
|
||||
* How to interact with Kilo Code using natural language
|
||||
* Why approval keeps you in control
|
||||
* How iteration lets the AI refine its work
|
||||
|
||||
Ready for more? Explore different [modes](/basic-usage/using-modes) or try [auto-approval](/features/auto-approving-actions) to speed up repetitive tasks.
|
||||
@@ -1,86 +0,0 @@
|
||||
---
|
||||
sidebar_label: Welcome
|
||||
---
|
||||
|
||||
import { DISCORD_URL, REDDIT_URL, GITHUB_ISSUES_MAIN_URL, GITHUB_FEATURES_URL, YOUTUBE_URL } from '@site/src/constants.ts'
|
||||
import Image from '@site/src/components/Image';
|
||||
|
||||
# Kilo Code Documentation
|
||||
|
||||
Kilo Code **accelerates** development with AI-driven code generation and task automation. This open source extension plugs directly into VS Code.
|
||||
|
||||
## What Can Kilo Code Do?
|
||||
|
||||
- 🚀 **Generate Code** from natural language descriptions
|
||||
- 🔧 **Refactor & Debug** existing code
|
||||
- 📝 **Write & Update** documentation
|
||||
- 🤔 **Answer Questions** about your codebase
|
||||
- 🔄 **Automate** repetitive tasks
|
||||
- 🏗️ **Create** new files and projects
|
||||
|
||||
## Quick Start
|
||||
|
||||
1. [Install Kilo Code](/getting-started/installing)
|
||||
2. [Set up Kilo Code](/getting-started/setting-up)
|
||||
3. [Try Your First Task](/getting-started/your-first-task)
|
||||
|
||||
## Features
|
||||
|
||||
<Image src="/docs/img/kilogif.gif" alt="GIF showing some of the capabilities of Kilo Code" width="600" />
|
||||
|
||||
### Basics
|
||||
|
||||
Use [the chat interface](/basic-usage/the-chat-interface) to tell Kilo Code what you need. It relies on coding‑optimized AI models to complete each request.
|
||||
|
||||
- Switch [modes](/basic-usage/using-modes) to fit the task
|
||||
- Control allowed [actions](/features/auto-approving-actions)
|
||||
- Run direct [code actions](/features/code-actions)
|
||||
|
||||
### Using Kilo Code
|
||||
|
||||
#### Multiple Modes
|
||||
Kilo Code adapts to your needs with specialized [modes](/basic-usage/using-modes):
|
||||
- [**Code Mode:**](/basic-usage/using-modes#code-mode-default) For general-purpose coding tasks
|
||||
- [**Architect Mode:**](/basic-usage/using-modes#architect-mode) For planning and technical leadership
|
||||
- [**Ask Mode:**](/basic-usage/using-modes#ask-mode) For answering questions and providing information
|
||||
- [**Debug Mode:**](/basic-usage/using-modes#debug-mode) For systematic problem diagnosis
|
||||
- **[Custom Modes](/features/custom-modes):** Create unlimited specialized personas for security auditing, performance optimization, documentation, or any other task
|
||||
|
||||
#### Core Tools
|
||||
Kilo Code comes with powerful [tools](/features/tools/tool-use-overview) that can:
|
||||
- [Read](/features/tools/read-file) and [write](/features/tools/write-to-file) files in your project
|
||||
- [Execute commands](/features/tools/execute-command) in your VS Code terminal
|
||||
- [Control a web browser](/features/tools/browser-action)
|
||||
- [Ask follow-up questions](/features/tools/ask-followup-question)
|
||||
- [Search your codebase](/features/tools/search-files)
|
||||
|
||||
See the complete [Tools Reference](/features/tools/tool-use-overview) for all available tools.
|
||||
|
||||
### Extending Kilo Code
|
||||
- **[MCP (Model Context Protocol)](/features/mcp/overview):** Add unlimited custom tools, integrate with external APIs, connect to databases, or create specialized development tools
|
||||
- **[Local Models](/advanced-usage/local-models):** Run Kilo Code with local AI models for offline use or enhanced privacy
|
||||
|
||||
### Customizing Kilo Code
|
||||
Make Kilo Code work your way with:
|
||||
- [Settings Management](/features/settings-management) for configuring your experience
|
||||
- [Custom Modes](/features/custom-modes) for specialized tasks
|
||||
- [Custom Rules](/advanced-usage/custom-rules) for project-specific rules
|
||||
- [Custom Instructions](/advanced-usage/custom-instructions) for global plugin-wide instructions
|
||||
- [API Configuration Profiles](/features/api-configuration-profiles) for different model providers
|
||||
- [Auto-Approval Settings](/features/auto-approving-actions) for faster workflows
|
||||
|
||||
## Resources
|
||||
|
||||
### Documentation
|
||||
- [Using Kilo Code](/basic-usage/the-chat-interface) - Learn the basics
|
||||
- [Core Concepts](/features/auto-approving-actions) - Master key features
|
||||
- [Advanced Usage](/advanced-usage/prompt-engineering) - Take your skills further
|
||||
- [Frequently Asked Questions](/faq) - Get answers to common questions
|
||||
|
||||
### Community
|
||||
- **Discord:** <a href={DISCORD_URL} target="_blank">Join our Discord server</a> for real-time help and discussions
|
||||
- **Reddit:** <a href={REDDIT_URL} target="_blank">Visit our subreddit</a> to share experiences and tips
|
||||
- **YouTube:** <a href={YOUTUBE_URL} target="_blank">Check out our YouTube</a> to learn hands on skills when using Kilo Code
|
||||
- **GitHub:** Report <a href={GITHUB_ISSUES_MAIN_URL} target="_blank">issues</a> or request <a href={GITHUB_FEATURES_URL} target="_blank">features</a>
|
||||
|
||||
Ready to get started? Click the **Next** button below to begin your journey with Kilo Code!
|
||||
@@ -1,114 +0,0 @@
|
||||
# JetBrains Plugin Troubleshooting
|
||||
|
||||
This guide covers common issues when using Kilo Code in JetBrains IDEs (IntelliJ IDEA, Android Studio, WebStorm, PyCharm, etc.).
|
||||
|
||||
## Known Missing Features
|
||||
|
||||
The following features, available in the VS Code version of Kilo Code, are not currently implemented in the JetBrains version:
|
||||
|
||||
- **Autocomplete/QuickTasks**
|
||||
- **Git Commit Message Generation** This feature is missing but will be added soon!
|
||||
|
||||
We're actively working on bringing feature parity between the VS Code and JetBrains versions. Check our [GitHub repository](https://github.com/Kilo-Org/kilocode) for updates on development progress.
|
||||
|
||||
## Node.js Requirements
|
||||
|
||||
### Why Node.js is Required
|
||||
|
||||
The JetBrains Kilo Extension requires Node.js to be installed on your system. Node.js is used to run the extension's backend services and handle communication between the IDE and Kilo Code's AI features.
|
||||
|
||||
### Installing Node.js
|
||||
|
||||
Visit the official Node.js website for installation instructions for your platform: [https://nodejs.org/en/download](https://nodejs.org/en/download)
|
||||
|
||||
We recommend downloading the **LTS (Long Term Support)** version for stability.
|
||||
|
||||
### Verifying Node.js Installation
|
||||
|
||||
After installation, verify that Node.js is properly installed by opening a terminal and running:
|
||||
|
||||
```bash
|
||||
node --version
|
||||
npm --version
|
||||
```
|
||||
|
||||
Both commands should return version numbers.
|
||||
|
||||
## JCEF (Java Chromium Embedded Framework) Issues
|
||||
|
||||
### What is JCEF?
|
||||
|
||||
JCEF (Java Chromium Embedded Framework) is required for Kilo Code's web-based interface to display properly in JetBrains IDEs. Most JetBrains IDEs include JCEF support by default, but some configurations may need manual activation.
|
||||
|
||||
## Fixing JCEF Issues by IDE
|
||||
|
||||
### Android Studio
|
||||
|
||||
JCEF is available in Android Studio but may need to be enabled manually:
|
||||
|
||||
1. **Open Settings/Preferences:**
|
||||
|
||||
- **Windows/Linux:** File → Settings
|
||||
- **macOS:** Help → Find Action...
|
||||
|
||||
2. **Navigate to Boot Java Runtime:**
|
||||
|
||||
- Choose Boot Java Runtime for the IDE...
|
||||
|
||||
3. **Pick a new runtime**
|
||||
|
||||
- Pick one that has "with JCEF" in the name
|
||||
|
||||
4. **Restart Android Studio:**
|
||||
|
||||
- Close and reopen Android Studio for the changes to take effect
|
||||
|
||||
5. **Verify:**
|
||||
- Open Kilo Code panel
|
||||
- The JCEF warning should be gone, and the interface should load properly
|
||||
|
||||
**Visual Guide:**
|
||||
|
||||
<img src="/docs/img/jetbrains/android-studio-jcef-enable.gif" alt="Step-by-step guide showing how to enable JCEF in Android Studio" width="600" />
|
||||
|
||||
_This animation shows the complete process of enabling JCEF in Android Studio._
|
||||
|
||||
### IntelliJ IDEA
|
||||
|
||||
JCEF should be enabled by default in IntelliJ IDEA. If you see JCEF warnings:
|
||||
|
||||
1. **Update IntelliJ IDEA:**
|
||||
|
||||
- Ensure you're running the latest version
|
||||
- Go to Help → Check for Updates
|
||||
|
||||
2. **Verify JetBrains Runtime:**
|
||||
|
||||
- IntelliJ IDEA should use JetBrains Runtime (JBR) by default
|
||||
- JBR includes JCEF support
|
||||
|
||||
3. **Check Advanced Settings:**
|
||||
- Go to File → Settings (Windows/Linux) or IntelliJ IDEA → Preferences (macOS)
|
||||
- Navigate to Advanced Settings
|
||||
- Look for any JCEF-related options and ensure they're enabled
|
||||
|
||||
### Other JetBrains IDEs
|
||||
|
||||
For WebStorm, PyCharm, PhpStorm, RubyMine, CLion, GoLand, DataGrip, and Rider:
|
||||
|
||||
1. **Update to Latest Version:**
|
||||
|
||||
- Most JCEF issues are resolved in recent versions
|
||||
- Use the built-in updater: Help → Check for Updates
|
||||
|
||||
2. **Verify JetBrains Runtime:**
|
||||
|
||||
- These IDEs should use JetBrains Runtime by default
|
||||
- JBR includes comprehensive JCEF support
|
||||
|
||||
3. **Check Settings:**
|
||||
- Go to File → Settings (Windows/Linux) or [IDE Name] → Preferences (macOS)
|
||||
- Navigate to Advanced Settings
|
||||
- Enable any JCEF-related options
|
||||
|
||||
_For general Kilo Code support and documentation, visit [kilocode.ai/docs](https://kilocode.ai/docs)_
|
||||
@@ -1,44 +0,0 @@
|
||||
---
|
||||
sidebar_label: Anthropic
|
||||
---
|
||||
|
||||
# Using Anthropic With Kilo Code
|
||||
|
||||
Anthropic is an AI safety and research company that builds reliable, interpretable, and steerable AI systems. Their Claude models are known for their strong reasoning abilities, helpfulness, and honesty.
|
||||
|
||||
**Website:** [https://www.anthropic.com/](https://www.anthropic.com/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Sign Up/Sign In:** Go to the [Anthropic Console](https://console.anthropic.com/). Create an account or sign in.
|
||||
2. **Navigate to API Keys:** Go to the [API keys](https://console.anthropic.com/settings/keys) section.
|
||||
3. **Create a Key:** Click "Create Key". Give your key a descriptive name (e.g., "Kilo Code").
|
||||
4. **Copy the Key:** **Important:** Copy the API key *immediately*. You will not be able to see it again. Store it securely.
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following Anthropic Claude models:
|
||||
|
||||
* `claude-3-7-sonnet-20250219` (Recommended)
|
||||
* `claude-3-7-sonnet-20250219:thinking` (Extended Thinking variant)
|
||||
* `claude-3-5-sonnet-20241022`
|
||||
* `claude-3-5-haiku-20241022`
|
||||
* `claude-3-opus-20240229`
|
||||
* `claude-3-haiku-20240307`
|
||||
|
||||
See [Anthropic's Model Documentation](https://docs.anthropic.com/en/docs/about-claude/models) for more details on each model's capabilities.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "Anthropic" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your Anthropic API key into the "Anthropic API Key" field.
|
||||
4. **Select Model:** Choose your desired Claude model from the "Model" dropdown.
|
||||
5. **(Optional) Custom Base URL:** If you need to use a custom base URL for the Anthropic API, check "Use custom base URL" and enter the URL. Most people won't need to adjust this.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Prompt Caching:** Claude 3 models support [prompt caching](https://docs.anthropic.com/en/docs/build-with-claude/prompt-caching), which can significantly reduce costs and latency for repeated prompts.
|
||||
* **Context Window:** Claude models have large context windows (200,000 tokens), allowing you to include a significant amount of code and context in your prompts.
|
||||
* **Pricing:** Refer to the [Anthropic Pricing](https://www.anthropic.com/pricing) page for the latest pricing information.
|
||||
* **Rate Limits:** Anthropic has strict rate limits based on [usage tiers](https://docs.anthropic.com/en/api/rate-limits#requirements-to-advance-tier). If you're repeatedly hitting rate limits, consider contacting Anthropic sales or accessing Claude through a different provider like [OpenRouter](/providers/openrouter) or [Requesty](/providers/requesty).
|
||||
@@ -1,91 +0,0 @@
|
||||
---
|
||||
sidebar_label: AWS Bedrock
|
||||
---
|
||||
|
||||
# Using AWS Bedrock With Kilo Code
|
||||
|
||||
Kilo Code supports accessing models through Amazon Bedrock, a fully managed service that makes a selection of high-performing foundation models (FMs) from leading AI companies available via a single API.
|
||||
|
||||
**Website:** [https://aws.amazon.com/bedrock/](https://aws.amazon.com/bedrock/)
|
||||
|
||||
## Prerequisites
|
||||
|
||||
* **AWS Account:** You need an active AWS account.
|
||||
* **Bedrock Access:** You must request and be granted access to Amazon Bedrock. See the [AWS Bedrock documentation](https://docs.aws.amazon.com/bedrock/latest/userguide/getting-started.html) for details on requesting access.
|
||||
* **Model Access:** Within Bedrock, you need to request access to the specific models you want to use (e.g., Anthropic Claude).
|
||||
* **Install AWS CLI:** Use AWS CLI to configure your account for authentication
|
||||
```bash
|
||||
aws configure
|
||||
```
|
||||
|
||||
## Getting Credentials
|
||||
|
||||
You have two main options for configuring AWS credentials:
|
||||
|
||||
1. **AWS Access Keys (Recommended for Development):**
|
||||
* Create an IAM user with the necessary permissions (at least `bedrock:InvokeModel`).
|
||||
* Generate an access key ID and secret access key for that user.
|
||||
* *(Optional)* Create a session token if required by your IAM configuration.
|
||||
2. **AWS Profile:**
|
||||
* Configure an AWS profile using the AWS CLI or by manually editing your AWS credentials file. See the [AWS CLI documentation](https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-profiles.html) for details.
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following models through Bedrock (based on source code):
|
||||
|
||||
* **Amazon:**
|
||||
* `amazon.nova-pro-v1:0`
|
||||
* `amazon.nova-pro-latency-optimized-v1:0`
|
||||
* `amazon.nova-lite-v1:0`
|
||||
* `amazon.nova-micro-v1:0`
|
||||
* `amazon.titan-text-lite-v1:0`
|
||||
* `amazon.titan-text-express-v1:0`
|
||||
* `amazon.titan-text-embeddings-v1:0`
|
||||
* `amazon.titan-text-embeddings-v2:0`
|
||||
* **Anthropic:**
|
||||
* `anthropic.claude-3-7-sonnet-20250219-v1:0`
|
||||
* `anthropic.claude-3-5-sonnet-20241022-v2:0`
|
||||
* `anthropic.claude-3-5-haiku-20241022-v1:0`
|
||||
* `anthropic.claude-3-5-sonnet-20240620-v1:0`
|
||||
* `anthropic.claude-3-opus-20240229-v1:0`
|
||||
* `anthropic.claude-3-sonnet-20240229-v1:0`
|
||||
* `anthropic.claude-3-haiku-20240307-v1:0`
|
||||
* `anthropic.claude-2-1-v1:0`
|
||||
* `anthropic.claude-2-0-v1:0`
|
||||
* `anthropic.claude-instant-v1:0`
|
||||
* **DeepSeek:**
|
||||
* `deepseek.r1-v1:0`
|
||||
* **Meta:**
|
||||
* `meta.llama3-3-70b-instruct-v1:0`
|
||||
* `meta.llama3-2-90b-instruct-v1:0`
|
||||
* `meta.llama3-2-11b-instruct-v1:0`
|
||||
* `meta.llama3-2-3b-instruct-v1:0`
|
||||
* `meta.llama3-2-1b-instruct-v1:0`
|
||||
* `meta.llama3-1-405b-instruct-v1:0`
|
||||
* `meta.llama3-1-70b-instruct-v1:0`
|
||||
* `meta.llama3-1-70b-instruct-latency-optimized-v1:0`
|
||||
* `meta.llama3-1-8b-instruct-v1:0`
|
||||
* `meta.llama3-70b-instruct-v1:0`
|
||||
* `meta.llama3-8b-instruct-v1:0`
|
||||
|
||||
Refer to the [Amazon Bedrock documentation](https://docs.aws.amazon.com/bedrock/latest/userguide/models-supported.html) for the most up-to-date list of available models and their IDs. Make sure to use the *model ID* when configuring Kilo Code, not the model name.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "Bedrock" from the "API Provider" dropdown.
|
||||
3. **Select Authentication Method:**
|
||||
* **AWS Credentials:**
|
||||
* Enter your "AWS Access Key" and "AWS Secret Key."
|
||||
* (Optional) Enter your "AWS Session Token" if you're using temporary credentials.
|
||||
* **AWS Profile:**
|
||||
* Enter your "AWS Profile" name (e.g., "default").
|
||||
4. **Select Region:** Choose the AWS region where your Bedrock service is available (e.g., "us-east-1").
|
||||
5. **(Optional) Cross-Region Inference:** Check "Use cross-region inference" if you want to access models in a region different from your configured AWS region.
|
||||
6. **Select Model:** Choose your desired model from the "Model" dropdown.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Permissions:** Ensure your IAM user or role has the necessary permissions to invoke Bedrock models. The `bedrock:InvokeModel` permission is required.
|
||||
* **Pricing:** Refer to the [Amazon Bedrock pricing](https://aws.amazon.com/bedrock/pricing/) page for details on model costs.
|
||||
* **Cross-Region Inference:** Using cross-region inference may result in higher latency.
|
||||
@@ -1,54 +0,0 @@
|
||||
---
|
||||
sidebar_label: Google Gemini
|
||||
---
|
||||
|
||||
# Using Google Gemini With Kilo Code
|
||||
|
||||
Kilo Code supports Google's Gemini family of models through the Google AI Gemini API.
|
||||
|
||||
**Website:** [https://ai.google.dev/](https://ai.google.dev/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Go to Google AI Studio:** Navigate to [https://ai.google.dev/](https://ai.google.dev/).
|
||||
2. **Sign In:** Sign in with your Google account.
|
||||
3. **Create API Key:** Click on "Create API key" in the left-hand menu.
|
||||
4. **Copy API Key:** Copy the generated API key.
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following Gemini models:
|
||||
|
||||
### Chat Models
|
||||
|
||||
* `gemini-2.5-pro-exp-03-25`
|
||||
* `gemini-2.0-flash-001`
|
||||
* `gemini-2.0-flash-lite-preview-02-05`
|
||||
* `gemini-2.0-pro-exp-02-05`
|
||||
* `gemini-2.0-flash-thinking-exp-01-21`
|
||||
* `gemini-2.0-flash-thinking-exp-1219`
|
||||
* `gemini-2.0-flash-exp`
|
||||
* `gemini-1.5-flash-002`
|
||||
* `gemini-1.5-flash-exp-0827`
|
||||
* `gemini-1.5-flash-8b-exp-0827`
|
||||
* `gemini-1.5-pro-002`
|
||||
* `gemini-1.5-pro-exp-0827`
|
||||
* `gemini-exp-1206`
|
||||
|
||||
### Embedding Models
|
||||
|
||||
* `gemini-embedding-001` - Optimized for codebase indexing and semantic search
|
||||
|
||||
Refer to the [Gemini documentation](https://ai.google.dev/models/gemini) for more details on each model.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "Google Gemini" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your Gemini API key into the "Gemini API Key" field.
|
||||
4. **Select Model:** Choose your desired Gemini model from the "Model" dropdown.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Pricing:** Gemini API usage is priced based on input and output tokens. Refer to the [Gemini pricing page](https://ai.google.dev/pricing) for detailed information.
|
||||
* **Codebase Indexing:** The `gemini-embedding-001` model is specifically supported for [codebase indexing](/features/codebase-indexing), providing high-quality embeddings for semantic code search.
|
||||
@@ -1,65 +0,0 @@
|
||||
---
|
||||
sidebar_label: Kilo Code Provider
|
||||
---
|
||||
|
||||
# Using Kilo Code's Built-in Provider
|
||||
|
||||
Kilo Code provides its own built-in API provider that gives you access to the latest frontier coding models through a simple registration process. No need to manage API keys from multiple providers - just sign up and start coding.
|
||||
|
||||
**Website:** [https://kilocode.ai/](https://kilocode.ai/)
|
||||
|
||||
## Getting Started
|
||||
|
||||
When you sign up for Kilo Code, you can start immediately with free models, or top up your account for the first time to get bonus credits.
|
||||
|
||||
To claim your bonus credits:
|
||||
|
||||
1. **Sign up:** Complete the registration process
|
||||
2. **First top-up:** Add funds to your account and get $20 bonus credits
|
||||
3. **Start Coding:** Enjoy your $20 in free credits
|
||||
|
||||
## Registration Process
|
||||
|
||||
Kilo Code offers a streamlined registration that connects you directly to frontier coding models:
|
||||
|
||||
1. **Start Registration:** Click "Try Kilo Code for Free" in the extension
|
||||
2. **Sign In:** Use your Google account to sign in at kilocode.ai
|
||||
3. **Authorize VS Code:**
|
||||
- kilocode.ai will prompt you to open Visual Studio Code
|
||||
- For web-based IDEs, you'll copy the API key manually instead
|
||||
4. **Complete Setup:** Allow VS Code to open the authorization URL when prompted
|
||||
|
||||
<!-- <img src="/img/setting-up/signupflow.gif" alt="Sign up and registration flow with Kilo Code" width="600" /> -->
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code provides access to the latest frontier coding models through its built-in provider. The specific models available are automatically updated and managed by the Kilo Code service, ensuring you always have access to the most capable models for coding tasks.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
Once you've completed the registration process, Kilo Code is automatically configured:
|
||||
|
||||
1. **Automatic Setup:** After successful registration, Kilo Code is ready to use immediately
|
||||
2. **No API Key Management:** Your authentication is handled seamlessly through the registration process
|
||||
3. **Model Selection:** Access to frontier models is provided automatically through your Kilo Code account
|
||||
|
||||
## Connected Accounts
|
||||
|
||||
With the Kilo Code provider, if you sign up with Google you can also connect other sign in accounts - like GitHub - by:
|
||||
|
||||
1. Go to your profile
|
||||
2. Select [**Connected Accounts**](https://app.kilocode.ai/connected-accounts)
|
||||
3. Under "Link a New account" select the type of account to link
|
||||
4. Complete the OAuth authorization, and you'll see your connected accounts!
|
||||
|
||||
<img src="/docs/img/kilo-provider/connected-accounts.png" alt="Connect account screen" width="600" />
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
- **Free Credits:** New users receive free credits to explore Kilo Code's capabilities
|
||||
- **Identity Verification:** The temporary hold system ensures service reliability while preventing misuse
|
||||
- **Seamless Integration:** No need to manage multiple API keys or provider configurations
|
||||
- **Latest Models:** Automatic access to the most current frontier coding models
|
||||
- **Support Available:** Contact [hi@kilocode.ai](mailto:hi@kilocode.ai) for questions about pricing or tokens
|
||||
|
||||
For detailed setup instructions, see [Setting up Kilo Code](/getting-started/setting-up).
|
||||
@@ -1,40 +0,0 @@
|
||||
---
|
||||
sidebar_label: LM Studio
|
||||
---
|
||||
|
||||
# Using LM Studio With Kilo Code
|
||||
|
||||
Kilo Code supports running models locally using LM Studio. LM Studio provides a user-friendly interface for downloading, configuring, and running local language models. It also includes a built-in local inference server that emulates the OpenAI API, making it easy to integrate with Kilo Code.
|
||||
|
||||
**Website:** [https://lmstudio.ai/](https://lmstudio.ai/)
|
||||
|
||||
## Setting Up LM Studio
|
||||
|
||||
1. **Download and Install LM Studio:** Download LM Studio from the [LM Studio website](https://lmstudio.ai/).
|
||||
2. **Download a Model:** Use the LM Studio interface to search for and download a model. Some recommended models include:
|
||||
* CodeLlama models (e.g., `codellama:7b-code`, `codellama:13b-code`, `codellama:34b-code`)
|
||||
* Mistral models (e.g., `mistralai/Mistral-7B-Instruct-v0.1`)
|
||||
* DeepSeek Coder models (e.g., `deepseek-coder:6.7b-base`)
|
||||
* Any other model that is supported by Kilo Code, or for which you can set the context window.
|
||||
|
||||
Look for models in the GGUF format. LM Studio provides a search interface to find and download models.
|
||||
3. **Start the Local Server:**
|
||||
* Open LM Studio.
|
||||
* Click the **"Local Server"** tab (the icon looks like `<->`).
|
||||
* Select the model you downloaded.
|
||||
* Click **"Start Server"**.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "LM Studio" from the "API Provider" dropdown.
|
||||
3. **Enter Model ID:** Enter the *file name* of the model you loaded in LM Studio (e.g., `codellama-7b.Q4_0.gguf`). You can find this in the LM Studio "Local Server" tab.
|
||||
4. **(Optional) Base URL:** By default, Kilo Code will connect to LM Studio at `http://localhost:1234`. If you've configured LM Studio to use a different address or port, enter the full URL here.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Resource Requirements:** Running large language models locally can be resource-intensive. Make sure your computer meets the minimum requirements for the model you choose.
|
||||
* **Model Selection:** LM Studio provides a wide range of models. Experiment to find the one that best suits your needs.
|
||||
* **Local Server:** The LM Studio local server must be running for Kilo Code to connect to it.
|
||||
* **LM Studio Documentation:** Refer to the [LM Studio documentation](https://lmstudio.ai/docs) for more information.
|
||||
* **Troubleshooting:** If you see a "Please check the LM Studio developer logs to debug what went wrong" error, you may need to adjust the context length settings in LM Studio.
|
||||
@@ -1,53 +0,0 @@
|
||||
---
|
||||
sidebar_label: Mistral AI
|
||||
---
|
||||
|
||||
# Using Mistral AI With Kilo Code
|
||||
|
||||
Kilo Code supports accessing models through the Mistral AI API, including both standard Mistral models and the code-specialized Codestral model.
|
||||
|
||||
**Website:** [https://mistral.ai/](https://mistral.ai/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Sign Up/Sign In:** Go to the [Mistral Platform](https://console.mistral.ai/). Create an account or sign in. You may need to go through a verification process.
|
||||
2. **Create an API Key:**
|
||||
- [La Plateforme API Key](https://console.mistral.ai/api-keys/) and/or
|
||||
- [Codestral API Key](https://console.mistral.ai/codestral)
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following Mistral models:
|
||||
|
||||
| Model ID | Model Default Temperature | Function Calling | Vision / Image support |
|
||||
|------------------------|-------------------------|------------------|--------|
|
||||
| codestral-latest | 0.3 | ✅ | ❌ |
|
||||
| devstral | 0.3 | ✅ | ❌ |
|
||||
| mistral-large-latest | 0.7 | ✅ | ❌ |
|
||||
| ministral-8b-latest | 0.3 | ✅ | ❌ |
|
||||
| ministral-3b-latest | 0.3 | ✅ | ❌ |
|
||||
| mistral-small-latest | 0.3 | ✅ | ❌ |
|
||||
| pixtral-large-latest | 0.7 | ✅ | ✅ |
|
||||
The default model temperature in Kilo Code is 0.0, so you should consider experimenting with [temperature adjustments](/features/model-temperature)!
|
||||
|
||||
**Note:** Model availability and specifications may change.
|
||||
Refer to the [Mistral AI documentation](https://docs.mistral.ai/api/) and [Mistral Model Overview](https://docs.mistral.ai/getting-started/models/models_overview/) for the latest information.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "Mistral" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your Mistral API key into the "Mistral API Key" field if you're using a `mistral` model. If you intend to use `codestral-latest`, see the "Codestral" section below.
|
||||
4. **Select Model:** Choose your desired model from the "Model" dropdown.
|
||||
|
||||
## Using Codestral
|
||||
|
||||
[Codestral](https://docs.mistral.ai/capabilities/code_generation/) is a model specifically designed for code generation and interaction.
|
||||
Only for Codestral you could use different endpoints (Default: codestral.mistral.ai).
|
||||
For the La Platforme API Key change the **Codestral Base Url** to: https://api.mistral.ai
|
||||
|
||||
To use Codestral:
|
||||
|
||||
1. **Select "Mistral" as the API Provider.**
|
||||
2. **Select a Codestral Model**
|
||||
3. **Enter your Codestral (codestral.mistral.ai) or La Plateforme (api.mistral.ai) API Key.**
|
||||
@@ -1,99 +0,0 @@
|
||||
---
|
||||
sidebar_label: Ollama
|
||||
---
|
||||
|
||||
# Using Ollama With Kilo Code
|
||||
|
||||
Kilo Code supports running models locally using Ollama. This provides privacy, offline access, and potentially lower costs, but requires more setup and a powerful computer.
|
||||
|
||||
**Website:** [https://ollama.com/](https://ollama.com/)
|
||||
|
||||
<img src="/docs/img/providers/ollama-devstral-snake.png" alt="Vibe coding a Snake game using devstral" width="500" />
|
||||
*Vibe coding a Snake game using devstral*
|
||||
|
||||
## Managing Expectations
|
||||
|
||||
The LLMs that can be run locally are generally much smaller than cloud-hosted LLMs such as Claude and GPT and the results will be much less impressive.
|
||||
They are much more likely to get stuck in loops, fail to use tools properly or produce syntax errors in code.
|
||||
More trial and error will be required to find the right prompt.
|
||||
Running LLMs locally is often also not very fast.
|
||||
Using simple prompts, keeping conversations short and disabling MCP tools can result in a speed-up.
|
||||
|
||||
## Hardware Requirements
|
||||
|
||||
You will need a GPU with a large amount of VRAM (24GB or more) or a MacBook with a large amount of unified RAM (32GB or more) to run the models discussed below at decent speed.
|
||||
|
||||
## Selecting a Model
|
||||
|
||||
Ollama supports many different models.
|
||||
You can find a list of available models on the [Ollama website](https://ollama.com/library).
|
||||
|
||||
For the Kilo Code agent the current recommendation is `qwen3-coder:30b`. `qwen3-coder:30b` sometimes fails to call tools correctly (it is much more likely to have this problem than the full `qwen3-coder:480b` model). As a mixture-of-experts model, this could be because it activated the wrong experts. Whenever this happens, try changing your prompt or use the Enhance Prompt button.
|
||||
|
||||
An alternative to `qwen3-coder:30b` is `devstral:24b`. For other features of Kilo Code such as Enhance Prompt or Commit Message Generation smaller models may suffice.
|
||||
|
||||
## Setting up Ollama
|
||||
|
||||
To set up Ollama for use with Kilo Code, follow the instructions below.
|
||||
|
||||
### Download and Install Ollama
|
||||
|
||||
Download the Ollama installer from the [Ollama website](https://ollama.com/) (or use the package manager for your operating system). Follow the installation instructions, then make sure Ollama is running:
|
||||
|
||||
```bash
|
||||
ollama serve
|
||||
```
|
||||
|
||||
### Download a Model
|
||||
|
||||
To download a model, open a second terminal (`ollama serve` needs to be running) and run:
|
||||
|
||||
```bash
|
||||
ollama pull <model_name>
|
||||
```
|
||||
|
||||
For example:
|
||||
|
||||
```bash
|
||||
ollama pull qwen3-coder:30b
|
||||
```
|
||||
|
||||
### Configure the Context Size
|
||||
|
||||
By default Ollama truncates prompts to a very short length, [as documented here](https://github.com/ollama/ollama/blob/4383a3ab7a075eff78b31f7dc84c747e2fcd22b8/docs/faq.md#how-can-i-specify-the-context-window-size).
|
||||
|
||||
You need to have at least 32k to get decent results, but increasing the context size increases memory usage and may decrease performance, depending on your hardware.
|
||||
To configure a model, you need to set its parameters and save a copy of it.
|
||||
|
||||
Load the model (we will use `qwen3-coder:30b` as an example):
|
||||
|
||||
```bash
|
||||
ollama run qwen3-coder:30b
|
||||
```
|
||||
|
||||
Change context size parameter:
|
||||
|
||||
```bash
|
||||
/set parameter num_ctx 32768
|
||||
```
|
||||
|
||||
Save the model with a new name:
|
||||
|
||||
```bash
|
||||
/save qwen3-coder-30b-c32k
|
||||
```
|
||||
|
||||
You can also set the `OLLAMA_CONTEXT_LENGTH` environment variable,
|
||||
but this is not recommended as it changes the context for all models and the environment variable needs to be visible to both the Ollama server and the IDE.
|
||||
|
||||
### Configure Kilo Code
|
||||
|
||||
- Open the Kilo Code sidebar (<img src="/docs/img/kilo-v1.svg" width="12" /> icon).
|
||||
- Click the Settings gear icon (<Codicon name="gear" />).
|
||||
- Select "Ollama" as the API Provider.
|
||||
- Select the model configured in the previous step.
|
||||
- (Optional) You can configure the base URL if you're running Ollama on a different machine. The default is `http://localhost:11434`.
|
||||
|
||||
## Further Reading
|
||||
|
||||
Refer to the [Ollama documentation](https://ollama.com/docs) for more information on installing, configuring and using Ollama.
|
||||
@@ -1,83 +0,0 @@
|
||||
---
|
||||
sidebar_label: OpenAI Compatible
|
||||
---
|
||||
|
||||
# Using OpenAI Compatible Providers With Kilo Code
|
||||
|
||||
Kilo Code supports a wide range of AI model providers that offer APIs compatible with the OpenAI API standard. This means you can use models from providers *other than* OpenAI, while still using a familiar API interface. This includes providers like:
|
||||
|
||||
* **Local models** running through tools like Ollama and LM Studio (covered in separate sections).
|
||||
* **Cloud providers** like Perplexity, Together AI, Anyscale, and others.
|
||||
* **Any other provider** offering an OpenAI-compatible API endpoint.
|
||||
|
||||
This document focuses on setting up providers *other than* the official OpenAI API (which has its own [dedicated configuration page](/providers/openai)).
|
||||
|
||||
## General Configuration
|
||||
|
||||
The key to using an OpenAI-compatible provider is to configure two main settings:
|
||||
|
||||
1. **Base URL:** This is the API endpoint for the provider. It will *not* be `https://api.openai.com/v1` (that's for the official OpenAI API).
|
||||
2. **API Key:** This is the secret key you obtain from the provider.
|
||||
3. **Model ID:** This is the model name of the specific model.
|
||||
|
||||
You'll find these settings in the Kilo Code settings panel (click the <Codicon name="gear" /> icon):
|
||||
|
||||
* **API Provider:** Select "OpenAI Compatible".
|
||||
* **Base URL:** Enter the base URL provided by your chosen provider. **This is crucial.**
|
||||
* **API Key:** Enter your API key.
|
||||
* **Model:** Choose a model.
|
||||
* **Model Configuration:** This lets you customize advanced configuration for the model
|
||||
- Max Output Tokens
|
||||
- Context Window
|
||||
- Image Support
|
||||
- Computer Use
|
||||
- Input Price
|
||||
- Output Price
|
||||
|
||||
### Full Endpoint URL Support
|
||||
|
||||
Kilo Code supports full endpoint URLs in the Base URL field, providing greater flexibility for provider configuration:
|
||||
|
||||
**Standard Base URL Format:**
|
||||
```
|
||||
https://api.provider.com/v1
|
||||
```
|
||||
|
||||
**Full Endpoint URL Format:**
|
||||
```
|
||||
https://api.provider.com/v1/chat/completions
|
||||
https://custom-endpoint.provider.com/api/v2/models/chat
|
||||
```
|
||||
|
||||
This enhancement allows you to:
|
||||
- Connect to providers with non-standard endpoint structures
|
||||
- Use custom API gateways or proxy services
|
||||
- Work with providers that require specific endpoint paths
|
||||
- Integrate with enterprise or self-hosted API deployments
|
||||
|
||||
**Note:** When using full endpoint URLs, ensure the URL points to the correct chat completions endpoint for your provider.
|
||||
|
||||
## Supported Models (for OpenAI Native Endpoint)
|
||||
|
||||
While this provider type allows connecting to various endpoints, if you are connecting directly to the official OpenAI API (or an endpoint mirroring it exactly), Kilo Code recognizes the following model IDs based on the `openAiNativeModels` definition in its source code:
|
||||
|
||||
* `o3-mini`
|
||||
* `o3-mini-high`
|
||||
* `o3-mini-low`
|
||||
* `o1`
|
||||
* `o1-preview`
|
||||
* `o1-mini`
|
||||
* `gpt-4.5-preview`
|
||||
* `gpt-4o`
|
||||
* `gpt-4o-mini`
|
||||
|
||||
**Note:** If you are using a different OpenAI-compatible provider (like Together AI, Anyscale, etc.), the available model IDs will vary. Always refer to your specific provider's documentation for their supported model names.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
* **"Invalid API Key":** Double-check that you've entered the API key correctly.
|
||||
* **"Model Not Found":** Make sure you're using a valid model ID for your chosen provider.
|
||||
* **Connection Errors:** Verify the Base URL is correct and that your provider's API is accessible.
|
||||
* **Unexpected Results:** If you're getting unexpected results, try a different model.
|
||||
|
||||
By using an OpenAI-compatible provider, you can leverage the flexibility of Kilo Code with a wider range of AI models. Remember to always consult your provider's documentation for the most accurate and up-to-date information.
|
||||
@@ -1,44 +0,0 @@
|
||||
---
|
||||
sidebar_label: OpenAI
|
||||
---
|
||||
|
||||
# Using OpenAI With Kilo Code
|
||||
|
||||
Kilo Code supports accessing models directly through the official OpenAI API.
|
||||
|
||||
**Website:** [https://openai.com/](https://openai.com/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Sign Up/Sign In:** Go to the [OpenAI Platform](https://platform.openai.com/). Create an account or sign in.
|
||||
2. **Navigate to API Keys:** Go to the [API keys](https://platform.openai.com/api-keys) page.
|
||||
3. **Create a Key:** Click "Create new secret key". Give your key a descriptive name (e.g., "Kilo Code").
|
||||
4. **Copy the Key:** **Important:** Copy the API key *immediately*. You will not be able to see it again. Store it securely.
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports a variety of OpenAI models, including:
|
||||
|
||||
* `o3-mini` (medium reasoning effort)
|
||||
* `o3-mini-high` (high reasoning effort)
|
||||
* `o3-mini-low` (low reasoning effort)
|
||||
* `o1`
|
||||
* `o1-preview`
|
||||
* `o1-mini`
|
||||
* `gpt-4.5-preview`
|
||||
* `gpt-4o`
|
||||
* `gpt-4o-mini`
|
||||
|
||||
Refer to the [OpenAI Models documentation](https://platform.openai.com/docs/models) for the most up-to-date list of models and capabilities.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "OpenAI" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your OpenAI API key into the "OpenAI API Key" field.
|
||||
4. **Select Model:** Choose your desired model from the "Model" dropdown.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Pricing:** Refer to the [OpenAI Pricing](https://openai.com/pricing) page for details on model costs.
|
||||
* **Azure OpenAI Service:** If you'd like to use the Azure OpenAI service, please see our section on [OpenAI-compatible](/providers/openai-compatible) providers.
|
||||
@@ -1,37 +0,0 @@
|
||||
---
|
||||
sidebar_label: OpenRouter
|
||||
---
|
||||
|
||||
# Using OpenRouter With Kilo Code
|
||||
|
||||
OpenRouter is an AI platform that provides access to a wide variety of language models from different providers, all through a single API. This can simplify setup and allow you to easily experiment with different models.
|
||||
|
||||
**Website:** [https://openrouter.ai/](https://openrouter.ai/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Sign Up/Sign In:** Go to the [OpenRouter website](https://openrouter.ai/). Sign in with your Google or GitHub account.
|
||||
2. **Get an API Key:** Go to the [keys page](https://openrouter.ai/keys). You should see an API key listed. If not, create a new key.
|
||||
3. **Copy the Key:** Copy the API key.
|
||||
|
||||
## Supported Models
|
||||
|
||||
OpenRouter supports a large and growing number of models. Kilo Code automatically fetches the list of available models. Refer to the [OpenRouter Models page](https://openrouter.ai/models) for the complete and up-to-date list.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "OpenRouter" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your OpenRouter API key into the "OpenRouter API Key" field.
|
||||
4. **Select Model:** Choose your desired model from the "Model" dropdown.
|
||||
5. **(Optional) Custom Base URL:** If you need to use a custom base URL for the OpenRouter API, check "Use custom base URL" and enter the URL. Leave this blank for most users.
|
||||
|
||||
## Supported Transforms
|
||||
|
||||
OpenRouter provides an [optional "middle-out" message transform](https://openrouter.ai/docs/features/message-transforms) to help with prompts that exceed the maximum context size of a model. You can enable it by checking the "Compress prompts and message chains to the context size" box.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Model Selection:** OpenRouter offers a wide range of models. Experiment to find the best one for your needs.
|
||||
* **Pricing:** OpenRouter charges based on the underlying model's pricing. See the [OpenRouter Models page](https://openrouter.ai/models) for details.
|
||||
* **Prompt Caching:** Some providers support prompt caching. See the OpenRouter documentation for supported models.
|
||||
@@ -1,47 +0,0 @@
|
||||
---
|
||||
sidebar_label: v0
|
||||
---
|
||||
|
||||
# Using v0 With Kilo Code
|
||||
|
||||
Kilo Code supports v0, Vercel's AI model provider that offers an OpenAI-compatible API. This allows you to use v0's models with Kilo Code through the familiar OpenAI API interface.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
To use v0 with Kilo Code, you'll need:
|
||||
|
||||
* A team account with Vercel v0
|
||||
* A v0 API key
|
||||
|
||||
## Configuration
|
||||
|
||||
Setting up v0 in Kilo Code is straightforward:
|
||||
|
||||
1. In Kilo Code settings (click the <Codicon name="gear" /> icon):
|
||||
* Under **API Provider**, select: **OpenAI Compatible**
|
||||
* Set the **Base URL**: `https://api.v0.dev/v1`
|
||||
* Paste in your v0 API key
|
||||
* Set the **Model ID**: `v0-1.0-md`
|
||||
* Click **Verify** to confirm the connection
|
||||
|
||||
<img src="/docs/img/providers/v0-setup.png" alt="v0 configuration in Kilo Code settings" width="600" />
|
||||
|
||||
## Supported Models
|
||||
|
||||
Currently, v0 offers the following model:
|
||||
|
||||
* `v0-1.0-md` - v0's multimodal model that supports both text and image inputs
|
||||
* `v0-1.5-lg` - composite model ([learn more](https://vercel.com/blog/v0-composite-model-family))
|
||||
* `v0-1.5.md` - composite model ([learn more](https://vercel.com/blog/v0-composite-model-family))
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
* **"Invalid API Key":** Double-check that you've entered the API key correctly.
|
||||
* **"Model Not Found":** Make sure you're using the correct model ID (`v0-1.0-md`).
|
||||
* **Connection Errors:** Verify the Base URL is correct (`https://api.v0.dev/v1`).
|
||||
* **Access Issues:** Confirm that your Vercel v0 team account is active and properly set up.
|
||||
|
||||
## Additional Resources
|
||||
|
||||
* [v0 Official Documentation](https://v0.dev)
|
||||
* [Vercel AI Documentation](https://vercel.com/docs/ai)
|
||||
@@ -1,65 +0,0 @@
|
||||
---
|
||||
sidebar_label: GCP Vertex AI
|
||||
---
|
||||
|
||||
# Using GCP Vertex AI With Kilo Code
|
||||
|
||||
Kilo Code supports accessing models through Google Cloud Platform's Vertex AI, a managed machine learning platform that provides access to various foundation models, including Anthropic's Claude family.
|
||||
|
||||
**Website:** [https://cloud.google.com/vertex-ai](https://cloud.google.com/vertex-ai)
|
||||
|
||||
## Prerequisites
|
||||
|
||||
* **Google Cloud Account:** You need an active Google Cloud Platform (GCP) account.
|
||||
* **Project:** You need a GCP project with the Vertex AI API enabled.
|
||||
* **Model Access:** You must request and be granted access to the specific Claude models on Vertex AI you want to use. See the [Google Cloud documentation](https://cloud.google.com/vertex-ai/generative-ai/docs/partner-models/use-claude#before_you_begin) for instructions.
|
||||
* **Application Default Credentials (ADC):** Kilo Code uses Application Default Credentials to authenticate with Vertex AI. The easiest way to set this up is to:
|
||||
1. Install the Google Cloud CLI: [https://cloud.google.com/sdk/docs/install](https://cloud.google.com/sdk/docs/install)
|
||||
2. Authenticate using: `gcloud auth application-default login`
|
||||
* **Service Account Key (Alternative):** Alternatively, you can authenticate using a Google Cloud Service Account key file. You'll need to generate this key in your GCP project. See the [Google Cloud documentation on creating service account keys](https://cloud.google.com/iam/docs/creating-managing-service-account-keys).
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following models through Vertex AI (based on source code):
|
||||
|
||||
* **Google Gemini Models:**
|
||||
* `gemini-2.5-flash-preview-05-20`
|
||||
* `gemini-2.0-flash-001`
|
||||
* `gemini-2.5-pro-exp-03-25`
|
||||
* `gemini-2.0-pro-exp-02-05`
|
||||
* `gemini-2.0-flash-lite-001`
|
||||
* `gemini-2.0-flash-thinking-exp-01-21`
|
||||
* `gemini-1.5-flash-002`
|
||||
* `gemini-1.5-pro-002`
|
||||
* **Anthropic Claude Models:**
|
||||
* `claude-opus-4@20250514:thinking`
|
||||
* `claude-opus-4@20250514`
|
||||
* `claude-sonnet-4@20250514:thinking`
|
||||
* `claude-sonnet-4@20250514`
|
||||
* `claude-3-7-sonnet@20250219:thinking`
|
||||
* `claude-3-7-sonnet@20250219`
|
||||
* `claude-3-5-sonnet-v2@20241022`
|
||||
* `claude-3-5-sonnet@20240620`
|
||||
* `claude-3-5-haiku@20241022`
|
||||
* `claude-3-opus@20240229`
|
||||
* `claude-3-haiku@20240307`
|
||||
|
||||
Refer to the [Google Cloud documentation on Vertex AI Models](https://cloud.google.com/vertex-ai/generative-ai/docs/learn/models) for the most up-to-date list of available models and their IDs.
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "GCP Vertex AI" from the "API Provider" dropdown.
|
||||
3. **Configure Authentication:**
|
||||
* **If using Application Default Credentials (ADC):** No further action is needed here. ADC will be used automatically if configured correctly (see Prerequisites).
|
||||
* **If *not* using ADC (Service Account Key):**
|
||||
* **Option A: Paste JSON Content:** Paste the entire content of your Service Account JSON key file into the **Google Cloud Credentials** field.
|
||||
* **Option B: Provide File Path:** Enter the absolute path to your downloaded Service Account JSON key file in the **Google Cloud Key File Path** field.
|
||||
4. **Enter Project ID:** Enter your Google Cloud Project ID.
|
||||
5. **Select Region:** Choose the region where your Vertex AI resources are located (e.g., `us-east5`).
|
||||
6. **Select Model:** Choose your desired model from the "Model" dropdown.
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Permissions:** Ensure your Google Cloud account has the necessary permissions to access Vertex AI and the specific models you want to use.
|
||||
* **Pricing:** Refer to the [Vertex AI pricing](https://cloud.google.com/vertex-ai/pricing) page for details.
|
||||
@@ -1,46 +0,0 @@
|
||||
---
|
||||
sidebar_label: VS Code Language Model API
|
||||
---
|
||||
|
||||
# Using VS Code Language Model API With Kilo Code
|
||||
|
||||
Kilo Code includes *experimental* support for the [VS Code Language Model API](https://code.visualstudio.com/api/language-extensions/language-model-access). This API allows extensions to provide access to language models directly within VS Code. This means you can potentially use models from:
|
||||
|
||||
* **GitHub Copilot:** If you have a Copilot subscription and the extension installed.
|
||||
* **Other VS Code Extensions:** Any extension that implements the Language Model API.
|
||||
|
||||
**Important:** This integration is highly experimental and may not work as expected. It is dependent on other extensions correctly implementing the VS Code Language Model API.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
* **VS Code:** The Language Model API is available through VS Code (and is not currently supported by Cursor).
|
||||
* **A Language Model Provider Extension:** You need an extension that provides a language model. Examples include:
|
||||
* **GitHub Copilot:** If you have a Copilot subscription, the GitHub Copilot and GitHub Copilot Chat extensions can provide models.
|
||||
* **Other Extensions:** Search the VS Code Marketplace for extensions that mention "Language Model API" or "lm". There may be other experimental extensions available.
|
||||
|
||||
## Configuration
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "VS Code LM API" from the "API Provider" dropdown.
|
||||
3. **Select Model:** The "Language Model" dropdown will (eventually) list available models. The format is `vendor/family`. For example, if you have Copilot, you might see options like:
|
||||
* `copilot - claude-3.5-sonnet`
|
||||
* `copilot - o3-mini`
|
||||
* `copilot - o1-ga`
|
||||
* `copilot - gemini-2.0-flash`
|
||||
|
||||
## Limitations
|
||||
|
||||
* **Experimental API:** The VS Code Language Model API is still under development. Expect changes and potential instability.
|
||||
* **Extension Dependent:** This feature relies entirely on other extensions providing models. Kilo Code cannot directly control which models are available.
|
||||
* **Limited Functionality:** The VS Code Language Model API may not support all the features of other API providers (e.g., image input, streaming, detailed usage information).
|
||||
* **No Direct Cost Control:** You are subject to the pricing and terms of the extension providing the model. Kilo Code cannot directly track or limit costs.
|
||||
* **GitHub Copilot Rate Limits:** When using the VS Code LM API with GitHub Copilot, be aware that GitHub may impose rate limits on Copilot usage. These limits are controlled by GitHub, not Kilo Code.
|
||||
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
* **No Models Appear:**
|
||||
* Ensure you have VS Code installed.
|
||||
* Ensure you have a language model provider extension installed and enabled (e.g., GitHub Copilot, GitHub Copilot Chat).
|
||||
* If using Copilot, make sure that you have sent a Copilot Chat message using the model you would like to use.
|
||||
* **Unexpected Behavior:** If you encounter unexpected behavior, it's likely an issue with the underlying Language Model API or the provider extension. Consider reporting the issue to the provider extension's developers.
|
||||
@@ -1,81 +0,0 @@
|
||||
---
|
||||
sidebar_label: xAI (Grok)
|
||||
---
|
||||
|
||||
# Using xAI (Grok) With Kilo Code
|
||||
|
||||
xAI is the company behind Grok, a large language model known for its conversational abilities and large context window. Grok models are designed to provide helpful, informative, and contextually relevant responses.
|
||||
|
||||
**Website:** [https://x.ai/](https://x.ai/)
|
||||
|
||||
## Getting an API Key
|
||||
|
||||
1. **Sign Up/Sign In:** Go to the [xAI Console](https://console.x.ai/). Create an account or sign in.
|
||||
2. **Navigate to API Keys:** Go to the API keys section in your dashboard.
|
||||
3. **Create a Key:** Click to create a new API key. Give your key a descriptive name (e.g., "Kilo Code").
|
||||
4. **Copy the Key:** **Important:** Copy the API key *immediately*. You will not be able to see it again. Store it securely.
|
||||
|
||||
## Supported Models
|
||||
|
||||
Kilo Code supports the following xAI Grok models:
|
||||
|
||||
### Grok-3 Models
|
||||
* `grok-3-beta` (Default) - xAI's Grok-3 beta model with 131K context window
|
||||
* `grok-3-fast-beta` - xAI's Grok-3 fast beta model with 131K context window
|
||||
* `grok-3-mini-beta` - xAI's Grok-3 mini beta model with 131K context window
|
||||
* `grok-3-mini-fast-beta` - xAI's Grok-3 mini fast beta model with 131K context window
|
||||
|
||||
### Grok-2 Models
|
||||
* `grok-2-latest` - xAI's Grok-2 model - latest version with 131K context window
|
||||
* `grok-2` - xAI's Grok-2 model with 131K context window
|
||||
* `grok-2-1212` - xAI's Grok-2 model (version 1212) with 131K context window
|
||||
|
||||
### Grok Vision Models
|
||||
* `grok-2-vision-latest` - xAI's Grok-2 Vision model - latest version with image support and 32K context window
|
||||
* `grok-2-vision` - xAI's Grok-2 Vision model with image support and 32K context window
|
||||
* `grok-2-vision-1212` - xAI's Grok-2 Vision model (version 1212) with image support and 32K context window
|
||||
* `grok-vision-beta` - xAI's Grok Vision Beta model with image support and 8K context window
|
||||
|
||||
### Legacy Models
|
||||
* `grok-beta` - xAI's Grok Beta model (legacy) with 131K context window
|
||||
|
||||
## Configuration in Kilo Code
|
||||
|
||||
1. **Open Kilo Code Settings:** Click the gear icon (<Codicon name="gear" />) in the Kilo Code panel.
|
||||
2. **Select Provider:** Choose "xAI" from the "API Provider" dropdown.
|
||||
3. **Enter API Key:** Paste your xAI API key into the "xAI API Key" field.
|
||||
4. **Select Model:** Choose your desired Grok model from the "Model" dropdown.
|
||||
|
||||
## Reasoning Capabilities
|
||||
|
||||
Grok 3 Mini models feature specialized reasoning capabilities, allowing them to "think before responding" - particularly useful for complex problem-solving tasks.
|
||||
|
||||
### Reasoning-Enabled Models
|
||||
|
||||
Reasoning is only supported by:
|
||||
* `grok-3-mini-beta`
|
||||
* `grok-3-mini-fast-beta`
|
||||
|
||||
The Grok 3 models `grok-3-beta` and `grok-3-fast-beta` do not support reasoning.
|
||||
|
||||
### Controlling Reasoning Effort
|
||||
|
||||
When using reasoning-enabled models, you can control how hard the model thinks with the `reasoning_effort` parameter:
|
||||
|
||||
* `low`: Minimal thinking time, using fewer tokens for quick responses
|
||||
* `high`: Maximum thinking time, leveraging more tokens for complex problems
|
||||
|
||||
Choose `low` for simple queries that should complete quickly, and `high` for harder problems where response latency is less important.
|
||||
|
||||
### Key Features
|
||||
|
||||
* **Step-by-Step Problem Solving**: The model thinks through problems methodically before delivering an answer
|
||||
* **Math & Quantitative Strength**: Excels at numerical challenges and logic puzzles
|
||||
* **Reasoning Trace Access**: The model's thinking process is available via the `reasoning_content` field in the response completion object
|
||||
|
||||
## Tips and Notes
|
||||
|
||||
* **Context Window:** Most Grok models feature large context windows (up to 131K tokens), allowing you to include substantial amounts of code and context in your prompts.
|
||||
* **Vision Capabilities:** Select vision-enabled models (`grok-2-vision-latest`, `grok-2-vision`, etc.) when you need to process or analyze images.
|
||||
* **Pricing:** Pricing varies by model, with input costs ranging from $0.3 to $5.0 per million tokens and output costs from $0.5 to $25.0 per million tokens. Refer to the xAI documentation for the most current pricing information.
|
||||
* **Performance Tradeoffs:** "Fast" variants typically offer quicker response times but may have higher costs, while "mini" variants are more economical but may have reduced capabilities.
|
||||
@@ -1,119 +0,0 @@
|
||||
---
|
||||
sidebar_label: Billing & Credits
|
||||
---
|
||||
|
||||
# Billing & Credits
|
||||
|
||||
Kilo for Teams uses a transparent, two-part billing system: a monthly subscription for seats plus pay-as-you-go AI credits with zero markup.
|
||||
|
||||
## Understanding the Billing Model
|
||||
|
||||
### Monthly Subscription
|
||||
|
||||
- **$29 per user per month** for platform access
|
||||
- **Billed monthly** on your signup anniversary
|
||||
- **Includes** dashboard access, team management, and all platform features
|
||||
|
||||
### AI Credits System
|
||||
|
||||
- **Pay exactly what AI providers charge** - no markup
|
||||
- **Pre-purchase credits** to fund AI requests
|
||||
- **Real-time deduction** as your team uses AI models
|
||||
- **Transparent pricing** - see exact provider costs
|
||||
|
||||
## How AI Credits Work
|
||||
|
||||
### Credit Purchase Process
|
||||
|
||||
1. **Navigate to Billing tab** in dashboard
|
||||
2. **Click "Buy Credits"**
|
||||
3. **Select credit amount** ($50, $100, $250, $500, $1000+)
|
||||
4. **Complete payment** using saved payment method
|
||||
5. **Credits available immediately** for team use
|
||||
|
||||
### Credit Consumption
|
||||
|
||||
- **Per-request billing** - pay only for what you use
|
||||
- **Model-specific rates** - different models have different costs
|
||||
- **Token-based pricing** - input and output tokens counted separately
|
||||
- **Real-time tracking** - see costs as requests happen
|
||||
|
||||
## Subscription Management
|
||||
|
||||
### Adding Seats
|
||||
|
||||
1. **Go to Subscriptions tab**
|
||||
2. **Click "Add Seats"**
|
||||
3. **Enter number of additional seats**
|
||||
4. **Review pro-rated cost** for current billing cycle
|
||||
5. **Confirm changes**
|
||||
|
||||
### Removing Seats
|
||||
|
||||
1. **Navigate to Subscriptions tab**
|
||||
2. **Click "Remove Seats"**
|
||||
3. **Select seats to remove** (must remove team members first)
|
||||
4. **Confirm reduction**
|
||||
|
||||
### Pro-Rating Calculations
|
||||
|
||||
- **Adding seats mid-cycle:** Pay proportional amount for remaining days
|
||||
- **Removing seats mid-cycle:** Seat change will start at the next billing cycle
|
||||
- **Billing date remains the same** regardless of seat changes
|
||||
- **Next full cycle** reflects new seat count
|
||||
|
||||
## Invoice Management
|
||||
|
||||
### Monthly Invoices
|
||||
|
||||
Each invoice includes:
|
||||
|
||||
- **Subscription charges** for all seats
|
||||
- **AI credit purchases** during billing period
|
||||
- **Tax calculations** based on your location
|
||||
- **Payment method** used for charges
|
||||
- **Detailed line items** for transparency
|
||||
|
||||
### Downloading Invoices
|
||||
|
||||
1. **Access Billing tab**
|
||||
2. **Find desired invoice** in history
|
||||
3. **Click "Download PDF"**
|
||||
4. **Save for expense reporting**
|
||||
|
||||
## Billing Troubleshooting
|
||||
|
||||
### Failed Payments
|
||||
|
||||
If a payment fails:
|
||||
|
||||
1. **Check payment method** validity (expiration, limits)
|
||||
2. **Update payment information** if needed
|
||||
3. **Retry payment** manually in dashboard
|
||||
4. **Contact support** if issues persist
|
||||
|
||||
### Billing Disputes
|
||||
|
||||
For billing questions:
|
||||
|
||||
1. **Review invoice details** in dashboard
|
||||
2. **Check usage analytics** for the billing period
|
||||
3. **Contact support** with specific questions
|
||||
4. **Provide invoice number** and dispute details
|
||||
|
||||
### Service Suspension
|
||||
|
||||
If payment fails repeatedly:
|
||||
|
||||
- **3-day grace period** to resolve payment issues
|
||||
- **Service suspension** after grace period expires
|
||||
- **Data retention** for 30 days during suspension
|
||||
- **Immediate restoration** upon payment resolution
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Explore usage analytics](/teams/analytics)
|
||||
- [Learn about team roles and permissions](/teams/roles-permissions)
|
||||
- [Learn about team management](/teams/team-management)
|
||||
|
||||
Transparent billing ensures you always know exactly what you're paying for, with no hidden fees or surprise charges.
|
||||
@@ -1,143 +0,0 @@
|
||||
---
|
||||
sidebar_label: Dashboard Overview
|
||||
---
|
||||
|
||||
# Teams Dashboard
|
||||
|
||||
The Kilo for Teams dashboard provides complete visibility into your team's AI usage, costs, and management.
|
||||
|
||||
<center>
|
||||
<img src="/docs/img/teams/dashboard.png" alt="Invite your team members" width="700" />
|
||||
</center>
|
||||
|
||||
## Dashboard Navigation
|
||||
|
||||
The dashboard is organized into five main tabs, each serving specific management needs:
|
||||
|
||||
- **Organization** - Team composition and quick actions
|
||||
- **Usage** - Real-time analytics and cost tracking
|
||||
- **Billing** - Financial management and invoicing
|
||||
- **Subscriptions** - Plan management and seat allocation
|
||||
|
||||
## Organization Tab
|
||||
|
||||
Your central hub for team management and organization overview.
|
||||
|
||||
### Key Information Display
|
||||
|
||||
- **Organization name** and creation date
|
||||
- **Current seat usage** (e.g., "8 of 10 seats used")
|
||||
- **Active members count** with role breakdown
|
||||
- **Data collection policy** status
|
||||
|
||||
### Team Member List
|
||||
|
||||
View all team members with:
|
||||
|
||||
- Name and email address
|
||||
- Current role (Owner, Admin, Member)
|
||||
- Last activity timestamp
|
||||
|
||||
### Quick Actions
|
||||
|
||||
- **Buy Credits** - Direct link to credit purchase
|
||||
- **Invite Member** - Send team invitations
|
||||
- **Manage Seats** - Adjust subscription size
|
||||
- **Policy Settings** - Configure data collection preferences
|
||||
|
||||
### Data Collection Controls
|
||||
|
||||
Toggle organization-wide policies:
|
||||
|
||||
- **Code training opt-out** - Prevent AI providers from using your code for training
|
||||
- **Usage analytics** - Control internal usage tracking
|
||||
|
||||
## Usage Tab
|
||||
|
||||
Real-time visibility into your team's AI consumption and costs.
|
||||
|
||||
### Overview Metrics
|
||||
|
||||
- **Total spend** (current billing period)
|
||||
- **Request count** (successful AI requests)
|
||||
- **Average cost per request**
|
||||
- **Token usage** (input/output breakdown)
|
||||
- **Active users** (users with activity in last 7 days)
|
||||
|
||||
### Model Popularity
|
||||
|
||||
Visual breakdown showing:
|
||||
|
||||
- Most-used AI models by request count
|
||||
- Cost distribution across different models
|
||||
- Provider usage patterns
|
||||
- Model performance metrics
|
||||
|
||||
### Time-Based Analytics
|
||||
|
||||
Interactive graphs displaying:
|
||||
|
||||
- **Daily usage trends** - Spot peak usage periods
|
||||
- **Weekly patterns** - Understand team workflows
|
||||
- **Monthly comparisons** - Track growth and optimization
|
||||
|
||||
### User-Level Insights
|
||||
|
||||
- Individual usage statistics (Owners and Admins only)
|
||||
- Top users by request volume
|
||||
- Usage distribution across team members
|
||||
|
||||
## Billing Tab
|
||||
|
||||
Complete financial management for your Kilo for Teams subscription.
|
||||
|
||||
- **Available credits** remaining
|
||||
- **Downloadable invoices** for expense reporting
|
||||
- **Payment status** for each billing cycle
|
||||
- **Primary payment method** on file
|
||||
- **Payment history** with transaction details
|
||||
|
||||
### Purchase History
|
||||
|
||||
- **Credit purchases** with timestamps
|
||||
- **Subscription changes** (seat additions/removals)
|
||||
- **Refunds and adjustments** (if any)
|
||||
- **Promotional credits** applied
|
||||
|
||||
## Subscriptions Tab
|
||||
|
||||
Manage your Kilo for Teams plan and seat allocation.
|
||||
|
||||
### Current Plan Details
|
||||
|
||||
- **Plan type** (Kilo for Teams)
|
||||
- **Monthly cost** per seat ($29/user/month)
|
||||
- **Billing cycle** dates and next charge
|
||||
- **Plan benefits** and included features
|
||||
|
||||
### Seat Management
|
||||
|
||||
- **Current seat count** and utilization
|
||||
- **Available seats** for new team members
|
||||
- **Seat history** showing additions and removals
|
||||
- **Cost impact** of seat changes with pro-rating
|
||||
|
||||
### Quick Actions
|
||||
|
||||
- **Add seats** for team growth
|
||||
- **Remove unused seats** to optimize costs
|
||||
- **Change billing frequency** (if available)
|
||||
- **Cancel subscription** (with confirmation)
|
||||
|
||||
### Billing Cycle Information
|
||||
|
||||
- **Next billing date** and amount
|
||||
- **Pro-rating calculations** for mid-cycle changes
|
||||
- **Renewal settings** and automatic billing
|
||||
- **Cancellation policy** and effective dates
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Learn about team management](/teams/team-management)
|
||||
- [Understand billing and credits](/teams/billing)
|
||||
- [Explore usage analytics](/teams/analytics)
|
||||
@@ -1,92 +0,0 @@
|
||||
---
|
||||
sidebar_label: Getting Started
|
||||
---
|
||||
|
||||
# Get Started with Kilo for Teams in 10 Minutes
|
||||
|
||||
Kilo for Teams brings transparent AI coding to your entire engineering organization. No markup on AI costs, no vendor lock-in, complete usage visibility.
|
||||
|
||||
**Launch Date:** September 10, 2025 | **Pricing:** $29/user/month
|
||||
|
||||
## What You Get
|
||||
|
||||
- **Zero markup** on AI provider costs - pay exactly what providers charge
|
||||
- **No rate limiting** or quality degradation during peak usage
|
||||
- **Centralized billing** - one invoice for your whole team
|
||||
- **Complete transparency** - see every request, cost, and usage pattern
|
||||
- **Team management** - roles, permissions, and usage controls
|
||||
- **Early adopter bonus** - $20 in free AI credits per seat
|
||||
|
||||
## Before You Begin
|
||||
|
||||
- Company email address (recommended for easier team management)
|
||||
- Approximate team size for initial seat planning
|
||||
- Credit card for billing setup
|
||||
- VS Code installed for team members
|
||||
|
||||
## Quick Setup Guide
|
||||
|
||||
### Step 1: Create Your Organization
|
||||
|
||||
1. Visit [app.kilocode.com](https://app.kilocode.com)
|
||||
2. Sign up using your company email
|
||||
3. Click **Organizations** in the left sidebar and then **Create New Organization**
|
||||
|
||||
<img src="/docs/img/teams/create-team.png" alt="Create new organization button" width="600" />
|
||||
|
||||
### Step 2: Subscribe to Teams
|
||||
|
||||
1. Enter your organization name
|
||||
2. Select your initial seat count
|
||||
3. Complete checkout process
|
||||
|
||||
<img src="/docs/img/teams/subscribe.png" alt="Create your organization and subscribe" width="600" />
|
||||
|
||||
💡 **Early Adopter Bonus:** Receive $20 in free AI credits per seat when you sign up before October 31, 2025.
|
||||
|
||||
### Step 3: Invite Your Team
|
||||
|
||||
1. Go to your **Organization**
|
||||
2. Click **Invite Member**
|
||||
3. Enter team member email
|
||||
4. Assign roles:
|
||||
- **Owner** - Full administrative access
|
||||
- **Admin** - Team management without billing
|
||||
- **Member** - Standard usage access
|
||||
|
||||
<img src="/docs/img/teams/invite-member.png" alt="Invite your team members" width="600" />
|
||||
|
||||
### Step 4: Team Members Install Extension
|
||||
|
||||
Team members receive invitation emails with these steps:
|
||||
|
||||
1. Accept the team invitation
|
||||
2. Install Kilo Code from [VS Code Marketplace](vscode:extension/kilocode.kilo-code)
|
||||
3. Sign in with their invited email
|
||||
4. Start coding with AI assistance
|
||||
|
||||
## What Happens Next
|
||||
|
||||
- **Immediate access** to all supported AI models
|
||||
- **Real-time usage tracking** in your dashboard
|
||||
- **Transparent billing** - see exactly what each request costs
|
||||
- **Team analytics** - understand usage patterns and optimization opportunities
|
||||
|
||||
<img src="/docs/img/teams/usage-details.png" alt="Team usage details page" width="600" />
|
||||
|
||||
## First Steps for Your Team
|
||||
|
||||
1. **Try basic tasks** - code generation, debugging, documentation
|
||||
2. **Explore different modes** - Code, Architect, Ask, Debug
|
||||
3. **Set personal preferences** - model selection, auto-approval settings
|
||||
4. **Review usage patterns** in the dashboard after first week
|
||||
|
||||
## Getting Support
|
||||
|
||||
You can find the dedicated Teams support methods directly on your Organaization's page.
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Learn about team roles and permissions](/teams/roles-permissions)
|
||||
- [Explore the dashboard features](/teams/dashboard)
|
||||
- [Set up team management policies](/teams/team-management)
|
||||
@@ -1,375 +0,0 @@
|
||||
---
|
||||
sidebar_label: Migrating from Other Tools
|
||||
---
|
||||
|
||||
# Migrating from Other Tools
|
||||
|
||||
Switch to Kilo for Teams from other AI coding tools and experience transparent pricing, no vendor lock-in, and superior team management capabilities.
|
||||
|
||||
## Why Teams Switch to Kilo
|
||||
|
||||
### Transparency vs. Opacity
|
||||
|
||||
**Other AI coding vendors** hide their true costs behind opaque subscription models, leaving you wondering what you're actually paying for.
|
||||
|
||||
**Kilo for Teams** shows you exactly what each AI request costs - no markup, no hidden fees, complete transparency.
|
||||
|
||||
### No Rate Limiting
|
||||
|
||||
**Other tools** slow you down with rate limits and model switching when you need AI most.
|
||||
|
||||
**Kilo for Teams** never limits your usage - pay for what you use, use what you need.
|
||||
|
||||
### True Team Management
|
||||
|
||||
**Other solutions** offer basic user management with limited visibility.
|
||||
|
||||
**Kilo for Teams** provides comprehensive team analytics, role-based permissions, and detailed usage insights.
|
||||
|
||||
## Migrating from Cursor
|
||||
|
||||
### What You're Leaving Behind
|
||||
|
||||
- **Opaque pricing** - Never knowing true AI costs
|
||||
- **Rate limiting** during peak usage periods
|
||||
- **Limited team visibility** into usage patterns
|
||||
- **Vendor lock-in** with proprietary systems
|
||||
- **Hidden model switching** that degrades quality
|
||||
|
||||
### What You Gain with Kilo for Teams
|
||||
|
||||
- **Transparent AI costs** - See exactly what providers charge
|
||||
- **No rate limiting** - Use AI when you need it most
|
||||
- **Comprehensive analytics** - Understand team usage patterns
|
||||
- **Open source extension** - No vendor lock-in
|
||||
- **Consistent quality** - No hidden model downgrades
|
||||
|
||||
### Migration Process
|
||||
|
||||
**Step 1: Team Assessment**
|
||||
|
||||
1. **Audit current Cursor usage** across your team
|
||||
2. **Identify active users** and their usage patterns
|
||||
3. **Calculate current costs** (if visible) vs. Kilo for Teams pricing
|
||||
4. **Plan migration timeline** to minimize disruption
|
||||
|
||||
**Step 2: Kilo for Teams Setup**
|
||||
|
||||
1. **Create organization** at [app.kilocode.com](https://app.kilocode.com)
|
||||
2. **Subscribe to Teams** with appropriate seat count
|
||||
3. **Configure team settings** and usage policies
|
||||
4. **Purchase initial AI credits** based on usage estimates
|
||||
|
||||
**Step 3: Team Migration**
|
||||
|
||||
1. **Invite team members** to Kilo for Teams
|
||||
2. **Install Kilo Code extension** alongside Cursor initially
|
||||
3. **Migrate projects gradually** starting with non-critical work
|
||||
4. **Train team** on Kilo Code features and workflows
|
||||
|
||||
**Step 4: Full Transition**
|
||||
|
||||
1. **Monitor usage patterns** in Kilo for Teams dashboard
|
||||
2. **Optimize settings** based on team feedback
|
||||
3. **Cancel Cursor subscriptions** once fully migrated
|
||||
4. **Uninstall Cursor** from team machines
|
||||
|
||||
### Cursor Feature Mapping
|
||||
|
||||
| Cursor Feature | Kilo for Teams Equivalent |
|
||||
| ---------------------- | ------------------------------------- |
|
||||
| AI Chat | Chat interface with multiple modes |
|
||||
| Code Generation | Code mode with advanced tools |
|
||||
| Code Editing | Fast edits and surgical modifications |
|
||||
| Codebase Understanding | Codebase indexing and search |
|
||||
| Team Management | Comprehensive team dashboard |
|
||||
| Usage Analytics | Detailed usage and cost analytics |
|
||||
|
||||
## Migrating from GitHub Copilot
|
||||
|
||||
### Limitations You're Escaping
|
||||
|
||||
- **Limited model choice** - Stuck with GitHub's model selection
|
||||
- **Basic team features** - Minimal team management capabilities
|
||||
- **No cost visibility** - Hidden usage costs in subscription
|
||||
- **Microsoft ecosystem lock-in** - Tied to Microsoft services
|
||||
- **Limited customization** - Few options for team-specific needs
|
||||
|
||||
### Kilo for Teams Advantages
|
||||
|
||||
- **Multiple AI providers** - Choose from 18+ model providers
|
||||
- **Advanced team management** - Roles, permissions, and analytics
|
||||
- **Transparent pricing** - See exact costs for every request
|
||||
- **Provider flexibility** - Switch providers or use your own API keys
|
||||
- **Extensive customization** - Custom modes and team policies
|
||||
|
||||
### Migration Strategy
|
||||
|
||||
**Phase 1: Parallel Usage (Week 1-2)**
|
||||
|
||||
1. **Keep GitHub Copilot** active during transition
|
||||
2. **Install Kilo Code** extension for team members
|
||||
3. **Start with simple tasks** in Kilo Code
|
||||
4. **Compare results** and team satisfaction
|
||||
|
||||
**Phase 2: Gradual Transition (Week 3-4)**
|
||||
|
||||
1. **Use Kilo Code** for new projects
|
||||
2. **Migrate existing projects** one at a time
|
||||
3. **Train team** on advanced features
|
||||
4. **Optimize usage patterns** based on analytics
|
||||
|
||||
**Phase 3: Full Migration (Week 5+)**
|
||||
|
||||
1. **Disable GitHub Copilot** for most team members
|
||||
2. **Cancel GitHub Copilot** subscriptions
|
||||
3. **Optimize Kilo for Teams** settings
|
||||
4. **Document new workflows** and best practices
|
||||
|
||||
### GitHub Copilot Feature Comparison
|
||||
|
||||
| GitHub Copilot | Kilo for Teams | Advantage |
|
||||
| ---------------- | -------------------------------- | ---------------------- |
|
||||
| Code suggestions | AI-powered code generation | ✅ More model choices |
|
||||
| Chat interface | Multi-mode chat system | ✅ Specialized modes |
|
||||
| Team admin | Comprehensive team management | ✅ Advanced analytics |
|
||||
| Usage insights | Detailed usage and cost tracking | ✅ Transparent pricing |
|
||||
| Model selection | 18+ AI providers and models | ✅ No vendor lock-in |
|
||||
|
||||
## Migrating from Other AI Coding Tools
|
||||
|
||||
### Common Migration Patterns
|
||||
|
||||
**From Tabnine**
|
||||
|
||||
- **Benefit:** More advanced AI models and team features
|
||||
- **Process:** Export settings, migrate team, configure advanced features
|
||||
- **Timeline:** 1-2 weeks for full transition
|
||||
|
||||
**From CodeWhisperer**
|
||||
|
||||
- **Benefit:** Escape AWS ecosystem lock-in, better team management
|
||||
- **Process:** Parallel usage, gradual migration, team training
|
||||
- **Timeline:** 2-3 weeks for enterprise teams
|
||||
|
||||
**From Replit AI**
|
||||
|
||||
- **Benefit:** Use in VS Code instead of web-based IDE
|
||||
- **Process:** Export projects, set up local development, team onboarding
|
||||
- **Timeline:** 3-4 weeks including development environment setup
|
||||
|
||||
### Universal Migration Checklist
|
||||
|
||||
**Pre-Migration Planning**
|
||||
|
||||
- [ ] Audit current AI coding tool usage
|
||||
- [ ] Identify team members and their roles
|
||||
- [ ] Calculate current costs vs. Kilo for Teams pricing
|
||||
- [ ] Plan migration timeline and milestones
|
||||
- [ ] Prepare team communication and training
|
||||
|
||||
**Migration Execution**
|
||||
|
||||
- [ ] Set up Kilo for Teams organization
|
||||
- [ ] Configure team settings and policies
|
||||
- [ ] Invite team members and assign roles
|
||||
- [ ] Install Kilo Code extension across team
|
||||
- [ ] Start with pilot projects or non-critical work
|
||||
|
||||
**Post-Migration Optimization**
|
||||
|
||||
- [ ] Monitor usage patterns and costs
|
||||
- [ ] Optimize team settings based on analytics
|
||||
- [ ] Train team on advanced features
|
||||
- [ ] Cancel previous AI coding tool subscriptions
|
||||
- [ ] Document new workflows and best practices
|
||||
|
||||
## Cost Comparison Analysis
|
||||
|
||||
### Hidden Costs in Other Tools
|
||||
|
||||
**Subscription Models Hide True Costs**
|
||||
|
||||
- Monthly fees regardless of actual usage
|
||||
- No visibility into per-request costs
|
||||
- Rate limiting forces inefficient workflows
|
||||
- Model switching without notification
|
||||
|
||||
**Kilo for Teams Transparent Pricing**
|
||||
|
||||
- Pay exactly what AI providers charge
|
||||
- See cost of every request in real-time
|
||||
- No rate limiting or usage restrictions
|
||||
- Choose optimal models for each task
|
||||
|
||||
### ROI Calculation Framework
|
||||
|
||||
**Current Tool Analysis**
|
||||
|
||||
1. **Monthly subscription costs** × team size
|
||||
2. **Hidden productivity losses** from rate limiting
|
||||
3. **Opportunity costs** from limited model access
|
||||
4. **Management overhead** from poor team visibility
|
||||
|
||||
**Kilo for Teams Benefits**
|
||||
|
||||
1. **Transparent AI costs** (typically 30-50% lower)
|
||||
2. **Productivity gains** from no rate limiting
|
||||
3. **Better outcomes** from optimal model selection
|
||||
4. **Reduced management time** with comprehensive analytics
|
||||
|
||||
### Sample Cost Comparison
|
||||
|
||||
**10-person team, moderate AI usage:**
|
||||
|
||||
| Tool | Monthly Cost | Hidden Costs | Total |
|
||||
| -------------- | --------------- | -------------------- | ----------- |
|
||||
| Cursor Pro | $200/month | Rate limiting losses | ~$300/month |
|
||||
| GitHub Copilot | $190/month | Limited model access | ~$250/month |
|
||||
| Kilo for Teams | $290 + AI costs | None | ~$200/month |
|
||||
|
||||
_Actual savings vary based on usage patterns and team efficiency gains._
|
||||
|
||||
## Team Training and Adoption
|
||||
|
||||
### Training Program Structure
|
||||
|
||||
**Week 1: Basics**
|
||||
|
||||
- Kilo Code extension installation and setup
|
||||
- Basic chat interface and mode usage
|
||||
- Understanding transparent pricing model
|
||||
- Team dashboard overview
|
||||
|
||||
**Week 2: Advanced Features**
|
||||
|
||||
- Custom modes and specialized workflows
|
||||
- Advanced tools and automation
|
||||
- Team collaboration features
|
||||
- Usage optimization strategies
|
||||
|
||||
**Week 3: Team Optimization**
|
||||
|
||||
- Analytics review and insights
|
||||
- Cost optimization techniques
|
||||
- Workflow integration and best practices
|
||||
- Advanced team management features
|
||||
|
||||
### Adoption Best Practices
|
||||
|
||||
**Start Small**
|
||||
|
||||
- Begin with volunteer early adopters
|
||||
- Use for non-critical projects initially
|
||||
- Gather feedback and iterate
|
||||
- Expand gradually across team
|
||||
|
||||
**Provide Support**
|
||||
|
||||
- Dedicated migration support channel
|
||||
- Regular check-ins with team members
|
||||
- Documentation and training resources
|
||||
- Quick resolution of issues and questions
|
||||
|
||||
**Measure Success**
|
||||
|
||||
- Track usage adoption rates
|
||||
- Monitor cost savings and efficiency gains
|
||||
- Collect team satisfaction feedback
|
||||
- Document success stories and best practices
|
||||
|
||||
## Common Migration Challenges
|
||||
|
||||
### Technical Challenges
|
||||
|
||||
**Extension Conflicts**
|
||||
|
||||
- **Issue:** Multiple AI coding extensions interfering
|
||||
- **Solution:** Disable old extensions during transition
|
||||
- **Prevention:** Staged migration with clear timelines
|
||||
|
||||
**Workflow Disruption**
|
||||
|
||||
- **Issue:** Team productivity dip during transition
|
||||
- **Solution:** Parallel usage period with gradual migration
|
||||
- **Prevention:** Comprehensive training and support
|
||||
|
||||
**Settings Migration**
|
||||
|
||||
- **Issue:** Lost customizations from previous tools
|
||||
- **Solution:** Document and recreate important settings
|
||||
- **Prevention:** Settings audit before migration
|
||||
|
||||
### Organizational Challenges
|
||||
|
||||
**Change Resistance**
|
||||
|
||||
- **Issue:** Team members reluctant to switch tools
|
||||
- **Solution:** Demonstrate clear benefits and provide training
|
||||
- **Prevention:** Involve team in migration planning
|
||||
|
||||
**Budget Approval**
|
||||
|
||||
- **Issue:** Finance team concerns about new tool costs
|
||||
- **Solution:** Provide detailed cost comparison and ROI analysis
|
||||
- **Prevention:** Transparent pricing documentation
|
||||
|
||||
**Timeline Pressure**
|
||||
|
||||
- **Issue:** Pressure to migrate quickly without proper planning
|
||||
- **Solution:** Phased migration approach with clear milestones
|
||||
- **Prevention:** Realistic timeline planning with buffer time
|
||||
|
||||
## Migration Support
|
||||
|
||||
### Professional Migration Services
|
||||
|
||||
- **Migration planning** and timeline development
|
||||
- **Team training** and onboarding support
|
||||
- **Custom integration** development
|
||||
- **Ongoing optimization** consulting
|
||||
|
||||
### Self-Service Resources
|
||||
|
||||
- **Migration guides** for specific tools
|
||||
- **Video tutorials** for common migration scenarios
|
||||
- **Community support** through Discord and forums
|
||||
- **Documentation** and best practices
|
||||
|
||||
### Getting Migration Help
|
||||
|
||||
- **Email:** migrations@kilocode.ai
|
||||
- **Discord:** Join our migration support channel
|
||||
- **Consultation:** Schedule free migration planning call
|
||||
- **Documentation:** Comprehensive migration guides
|
||||
|
||||
## Success Stories
|
||||
|
||||
### Mid-Size Software Company (25 developers)
|
||||
|
||||
**Previous:** Cursor Pro subscriptions
|
||||
**Challenge:** High costs with limited visibility
|
||||
**Result:** 40% cost reduction with better team insights
|
||||
**Timeline:** 3-week migration with zero productivity loss
|
||||
|
||||
### Enterprise Development Team (100+ developers)
|
||||
|
||||
**Previous:** GitHub Copilot Enterprise
|
||||
**Challenge:** Limited model choice and team management
|
||||
**Result:** Improved code quality and team collaboration
|
||||
**Timeline:** 6-week phased migration across multiple teams
|
||||
|
||||
### Startup Engineering Team (8 developers)
|
||||
|
||||
**Previous:** Multiple individual AI tool subscriptions
|
||||
**Challenge:** Expense report chaos and no team coordination
|
||||
**Result:** Centralized billing and improved team efficiency
|
||||
**Timeline:** 1-week migration with immediate benefits
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Get started with your team](/teams/getting-started)
|
||||
- [Explore team management features](/teams/team-management)
|
||||
- [Understand billing and pricing](/teams/billing)
|
||||
|
||||
Ready to make the switch? Contact our migration team at migrations@kilocode.ai to plan your transition to transparent AI coding.
|
||||
@@ -1,181 +0,0 @@
|
||||
---
|
||||
sidebar_label: Team Roles & Permissions
|
||||
---
|
||||
|
||||
# Team Roles & Permissions
|
||||
|
||||
Kilo for Teams uses a three-tier role system designed for clear responsibility separation and secure team management.
|
||||
|
||||
## Role Overview
|
||||
|
||||
Every team member has one of three roles that determine their access level and capabilities within your organization.
|
||||
|
||||
### Owner
|
||||
|
||||
**Full administrative control** - The person who created the organization or was promoted by another owner.
|
||||
|
||||
**Key Responsibilities:**
|
||||
|
||||
- Financial management and billing oversight
|
||||
- Strategic team planning and seat allocation
|
||||
- Ultimate security and compliance authority
|
||||
|
||||
### Admin
|
||||
|
||||
**Team management without financial access** - Trusted team leads who manage day-to-day operations.
|
||||
|
||||
**Key Responsibilities:**
|
||||
|
||||
- Team member onboarding and management
|
||||
- Usage monitoring and optimization
|
||||
- Policy enforcement and compliance
|
||||
|
||||
### Member
|
||||
|
||||
**Standard usage access** - Individual contributors who use Kilo Code for development work.
|
||||
|
||||
**Key Responsibilities:**
|
||||
|
||||
- Personal usage monitoring
|
||||
- Following team policies and guidelines
|
||||
- Productive AI-assisted development
|
||||
|
||||
## Detailed Permissions Matrix
|
||||
|
||||
| Capability | Owner | Admin | Member |
|
||||
| -------------------------------- | ----- | -------------- | ------ |
|
||||
| **Financial Management** |
|
||||
| Purchase AI credits | ✅ | ❌ | ❌ |
|
||||
| View billing history | ✅ | ✅ (read-only) | ❌ |
|
||||
| Manage payment methods | ✅ | ❌ | ❌ |
|
||||
| Download invoices | ✅ | ✅ | ❌ |
|
||||
| **Team Management** |
|
||||
| Add/remove members | ✅ | ✅ | ❌ |
|
||||
| Change member roles | ✅ | ✅\* | ❌ |
|
||||
| Manage seat count | ✅ | ❌ | ❌ |
|
||||
| View team composition | ✅ | ✅ | ✅ |
|
||||
| **Usage Controls** |
|
||||
| Set daily usage limits | ✅ | ✅ | ❌ |
|
||||
| View all usage statistics | ✅ | ✅ | ❌ |
|
||||
| View personal usage | ✅ | ✅ | ✅ |
|
||||
| **Security & Compliance** |
|
||||
| Control data collection policies | ✅ | ✅ | ❌ |
|
||||
| Manage model access permissions | ✅ | ✅ | ❌ |
|
||||
| Configure SSO settings | ✅ | ❌ | ❌ |
|
||||
| **Development Access** |
|
||||
| Use AI coding assistance | ✅ | ✅ | ✅ |
|
||||
| Access all enabled models | ✅ | ✅ | ✅ |
|
||||
| Personal settings management | ✅ | ✅ | ✅ |
|
||||
|
||||
\*Admins can change roles for other members and admins, but cannot promote/demote owners.
|
||||
|
||||
## Role Assignment Best Practices
|
||||
|
||||
### Choose Owners Carefully
|
||||
|
||||
- Limit to 1-2 people maximum
|
||||
- Select individuals with financial authority
|
||||
- Ensure owners understand billing implications
|
||||
- Consider succession planning
|
||||
|
||||
### Leverage Admin Role
|
||||
|
||||
- Assign to team leads and senior developers
|
||||
- Perfect for those managing development workflows
|
||||
- Ideal for compliance officers or security leads
|
||||
- Use for people who need visibility without financial access
|
||||
|
||||
### Member Role for Most Users
|
||||
|
||||
- Default role for individual contributors
|
||||
- Appropriate for contractors and temporary team members
|
||||
- Suitable for junior developers learning the platform
|
||||
- Best for users who only need coding assistance
|
||||
|
||||
## Changing Roles
|
||||
|
||||
### Promoting Members
|
||||
|
||||
1. Navigate to **Organization** tab
|
||||
2. Find the team member in the list
|
||||
3. Click the role dropdown next to their name
|
||||
4. Select the new role
|
||||
5. Confirm the change
|
||||
|
||||
### Role Change Limitations
|
||||
|
||||
- Only owners can promote other owners
|
||||
- Admins cannot change owner roles
|
||||
- Role changes take effect immediately
|
||||
- Members are notified of role changes via email
|
||||
|
||||
## Security Considerations
|
||||
|
||||
### Owner Security
|
||||
|
||||
- Enable two-factor authentication
|
||||
- Use strong, unique passwords
|
||||
- Regularly review team access
|
||||
- Monitor billing for unusual activity
|
||||
|
||||
### Admin Oversight
|
||||
|
||||
- Admins should regularly audit team usage
|
||||
- Review and update usage limits quarterly
|
||||
- Monitor for policy violations
|
||||
- Ensure compliance with data policies
|
||||
|
||||
### Member Guidelines
|
||||
|
||||
- Members should report suspicious activity
|
||||
- Follow organization data policies
|
||||
- Use AI assistance responsibly
|
||||
- Report technical issues promptly
|
||||
|
||||
## Common Role Scenarios
|
||||
|
||||
### Small Team (2-5 people)
|
||||
|
||||
- **1 Owner:** Founder or technical lead
|
||||
- **1 Admin:** Senior developer or team lead
|
||||
- **2-3 Members:** Individual contributors
|
||||
|
||||
### Medium Team (6-20 people)
|
||||
|
||||
- **1-2 Owners:** CTO and engineering manager
|
||||
- **2-3 Admins:** Team leads and senior developers
|
||||
- **15+ Members:** Individual contributors and junior developers
|
||||
|
||||
### Large Team (20+ people)
|
||||
|
||||
- **2 Owners:** CTO and VP of Engineering
|
||||
- **4-6 Admins:** Team leads, security officer, compliance manager
|
||||
- **20+ Members:** All other developers and contributors
|
||||
|
||||
## Troubleshooting Role Issues
|
||||
|
||||
### Can't Change Someone's Role
|
||||
|
||||
- Verify you have sufficient permissions (Owner or Admin)
|
||||
- Check if you're trying to modify an Owner (only Owners can do this)
|
||||
- Ensure the person is still an active team member
|
||||
|
||||
### Missing Permissions
|
||||
|
||||
- Confirm your current role in the Organization tab
|
||||
- Contact an Owner or Admin if you need elevated access
|
||||
- Check if your role was recently changed
|
||||
|
||||
### Billing Access Issues
|
||||
|
||||
- Only Owners can manage billing and payments
|
||||
- Admins can view billing history but cannot make changes
|
||||
- Contact an Owner for billing-related requests
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Learn about dashboard features](/teams/dashboard)
|
||||
- [Set up team management policies](/teams/team-management)
|
||||
- [Configure billing and credits](/teams/billing)
|
||||
|
||||
Understanding roles and permissions ensures your team operates securely and efficiently with clear accountability.
|
||||
@@ -1,164 +0,0 @@
|
||||
---
|
||||
sidebar_label: Managing Your Team
|
||||
---
|
||||
|
||||
# Managing Your Team
|
||||
|
||||
Effective team management in Kilo for Teams ensures optimal AI usage, cost control, and smooth collaboration across your engineering organization.
|
||||
|
||||
## Adding Team Members
|
||||
|
||||
### Invitation Process
|
||||
|
||||
1. **Navigate to Organization Tab** in your profile page and click on the team you want to manage
|
||||
2. **Click "Invite Member"** button
|
||||
3. **Enter the team member's email address**
|
||||
4. **Select initial role** (Member, Admin, or Owner)
|
||||
5. Click **Send Invitation**
|
||||
|
||||
<img src="/docs/img/teams/invite-member.png" alt="Invite your team members" width="600" />
|
||||
|
||||
<!-- ## Setting Usage Limits
|
||||
|
||||
### Daily Spending Limits
|
||||
|
||||
Control costs by setting daily limits per user:
|
||||
|
||||
1. **Go to Organization tab**
|
||||
2. **Find team member** in the list
|
||||
3. **Click "Set Limit"** next to their name
|
||||
4. **Enter daily dollar amount** (e.g., $10.00)
|
||||
5. **Save changes**
|
||||
|
||||
### How Limits Work
|
||||
|
||||
- **$0 = Unlimited** - No spending restrictions
|
||||
- **Soft limits** - Users receive warnings at 80% of limit
|
||||
- **Hard limits** - AI requests blocked when limit reached
|
||||
- **Daily reset** - Limits reset at midnight UTC
|
||||
- **Rollover** - Unused limits don't carry over to next day
|
||||
|
||||
### Recommended Limit Guidelines
|
||||
|
||||
**Individual Contributors**
|
||||
|
||||
- **Junior developers:** $5-10/day
|
||||
- **Senior developers:** $10-20/day
|
||||
- **Occasional users:** $2-5/day
|
||||
|
||||
**Team Leads and Architects**
|
||||
|
||||
- **Team leads:** $15-25/day
|
||||
- **Architects:** $20-30/day
|
||||
- **Heavy users:** $25-50/day
|
||||
|
||||
**Special Cases**
|
||||
|
||||
- **Demo/training days:** Temporarily increase limits
|
||||
- **Hackathons:** Remove limits for event duration
|
||||
- **New feature development:** Higher limits for exploration
|
||||
|
||||
### Monitoring Usage Patterns
|
||||
|
||||
Track team usage to optimize limits:
|
||||
|
||||
- **Weekly usage reports** show actual consumption
|
||||
- **Peak usage days** help identify patterns
|
||||
- **Model preferences** affect cost per request
|
||||
- **Task complexity** influences daily needs -->
|
||||
|
||||
## Managing Team Composition
|
||||
|
||||
### Viewing Team Status
|
||||
|
||||
The Organization tab shows:
|
||||
|
||||
- **Active members** with last activity
|
||||
- **Pending invitations** awaiting acceptance
|
||||
- **Seat utilization** (used vs. available)
|
||||
- **Role distribution** across the team
|
||||
|
||||
### Removing Team Members
|
||||
|
||||
When team members leave:
|
||||
|
||||
1. **Navigate to Organization tab**
|
||||
2. **Find the departing member**
|
||||
3. **Click "Remove" button**
|
||||
4. **Confirm removal**
|
||||
5. **Seat becomes available** immediately
|
||||
|
||||
### Role Changes
|
||||
|
||||
Promote or demote team members as needed:
|
||||
|
||||
1. **Locate team member** in Organization tab
|
||||
2. **Click role dropdown** next to their name
|
||||
3. **Select new role** (Member, Admin, Owner)
|
||||
4. **Confirm change**
|
||||
5. **Member receives email notification**
|
||||
|
||||
### Cost Optimization Strategies
|
||||
|
||||
**Model Selection**
|
||||
|
||||
- Train team on cost-effective model choices
|
||||
- Use cheaper models for simple tasks
|
||||
- Reserve expensive models for complex problems
|
||||
- Monitor model performance vs. cost
|
||||
|
||||
**Usage Patterns**
|
||||
|
||||
- Identify peak usage times
|
||||
- Batch similar requests when possible
|
||||
- Avoid redundant AI requests
|
||||
- Share solutions across team members
|
||||
|
||||
**Limit Adjustments**
|
||||
|
||||
- Regularly review and adjust individual limits
|
||||
- Increase limits for high-value activities
|
||||
- Decrease limits for occasional users
|
||||
- Set temporary limits for special projects
|
||||
|
||||
## Troubleshooting Common Issues
|
||||
|
||||
### Invitation Problems
|
||||
|
||||
**Invitations Not Received**
|
||||
|
||||
- Check spam/junk folders
|
||||
- Verify email address spelling
|
||||
- Resend invitation after 24 hours
|
||||
- Contact support if persistent issues
|
||||
|
||||
**Can't Accept Invitation**
|
||||
|
||||
- Ensure using correct email address
|
||||
- Clear browser cache and cookies
|
||||
- Try different browser or incognito mode
|
||||
- Check for corporate firewall restrictions
|
||||
|
||||
### Access Issues
|
||||
|
||||
**Member Can't Access Dashboard**
|
||||
|
||||
- Verify they accepted the invitation
|
||||
- Check their role permissions
|
||||
- Ensure they're using invited email address
|
||||
- Confirm organization membership
|
||||
|
||||
**Usage Limits Not Working**
|
||||
|
||||
- Verify limits are set correctly
|
||||
- Check timezone differences (limits reset at UTC midnight)
|
||||
- Confirm user is within their role permissions
|
||||
- Review recent usage in dashboard
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Understand billing and credits](/teams/billing)
|
||||
- [Explore usage analytics](/teams/analytics)
|
||||
- [Learn about team roles and permissions](/teams/roles-permissions)
|
||||
|
||||
Effective team management ensures your organization maximizes the benefits of AI-assisted development while maintaining cost control and security.
|
||||
@@ -1,19 +0,0 @@
|
||||
# Tips & Tricks
|
||||
|
||||
A collection of quick tips to help you get the most out of Kilo Code.
|
||||
|
||||
- Drag Kilo Code to the [Secondary Sidebar](https://code.visualstudio.com/api/ux-guidelines/sidebars#secondary-sidebar) so you can see the Explorer, Search, Source Control, etc.
|
||||
- Once you have Kilo Code in a separate sidebar from the file explorer, you can drag files from the explorer into the chat window (and even multiple at once). Just make sure to hold down the shift key after you start dragging the files.
|
||||
- If you're not using [MCP](/features/mcp/overview), turn it off in the <Codicon name="notebook" /> Prompts tab to significantly cut down the size of the system prompt.
|
||||
- To keep your [custom modes](/features/custom-modes) on track, limit the types of files that they're allowed to edit.
|
||||
- If you hit the dreaded `input length and max tokens exceed context limit` error, you can recover by deleting a message, rolling back to a previous checkpoint, or switching over to a model with a long context window like Gemini for a message.
|
||||
- In general, be thoughtful about your `Max Tokens` setting for thinking models. Every token you allocate to that takes away from space available to store conversation history. Consider only using high `Max Tokens` / `Max Thinking Tokens` settings with modes like Architect and Debug, and keeping Code mode at 16k max tokens or less.
|
||||
- If there's a real world job posting for something you want a custom mode to do, try asking Code mode to `Create a custom mode based on the job posting at @[url]`
|
||||
- If you want to really accelerate, check out multiple copies of your repository and run Kilo Code on all of them in parallel (using git to resolve any conflicts, same as with human devs).
|
||||
- When using Debug mode, ask Kilo to "start a new task in Debug mode with all of the necessary context needed to figure out X" so that the debugging process uses its own context window and doesn't pollute the main task
|
||||
- Add your own tips by clicking "Edit this page" below!
|
||||
- To manage large files and reduce context/resource usage, adjust the `File read auto-truncate threshold` setting. This setting controls the number of lines read from a file in one batch. Lower values can improve performance when working with very large files, but may require more read operations. You can find this setting in the Kilo Code settings under 'Advanced Settings'.
|
||||
|
||||
| Browser Tab | Auto-Approve Tab | Display Tab |
|
||||
|---------|---------|---------|
|
||||
| [](https://youtube.com/shorts/VMPKXt8k050?feature=shared) | [](https://youtube.com/shorts/NBccFnYDQ-k?feature=shared) | [](https://youtube.com/shorts/qYrT2pbfS7E?feature=shared) |
|
||||
@@ -1,269 +0,0 @@
|
||||
import {themes as prismThemes} from 'prism-react-renderer';
|
||||
import type {Config} from '@docusaurus/types';
|
||||
import type * as Preset from '@docusaurus/preset-classic';
|
||||
import {
|
||||
DISCORD_URL,
|
||||
REDDIT_URL,
|
||||
TWITTER_URL,
|
||||
GITHUB_MAIN_REPO_URL,
|
||||
GITHUB_ISSUES_MAIN_URL,
|
||||
GITHUB_FEATURES_URL,
|
||||
VSCODE_MARKETPLACE_URL,
|
||||
OPEN_VSX_URL,
|
||||
CONTACT_EMAIL,
|
||||
CAREERS_URL,
|
||||
WEBSITE_PRIVACY_URL,
|
||||
EXTENSION_PRIVACY_URL,
|
||||
GITHUB_REPO_URL
|
||||
} from './src/constants';
|
||||
|
||||
// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
|
||||
|
||||
const config: Config = {
|
||||
title: 'Kilo Code Docs',
|
||||
tagline: 'Kilo Code Documentation',
|
||||
favicon: 'img/favicon.ico',
|
||||
|
||||
// Set the production url of your site here
|
||||
url: 'https://kilocode.ai',
|
||||
// Set the /<baseUrl>/ pathname under which your site is served
|
||||
// For GitHub pages deployment, it is often '/<projectName>/'
|
||||
baseUrl: '/docs',
|
||||
|
||||
customFields: {
|
||||
freeTierAmount: process.env.FREE_TIER_AMOUNT || '$20',
|
||||
},
|
||||
|
||||
|
||||
onBrokenLinks: 'throw',
|
||||
onBrokenMarkdownLinks: 'warn',
|
||||
|
||||
// Even if you don't use internationalization, you can use this field to set
|
||||
// useful metadata like html lang. For example, if your site is Chinese, you
|
||||
// may want to replace "en" with "zh-Hans".
|
||||
i18n: {
|
||||
defaultLocale: 'en',
|
||||
locales: ['en', 'zh-CN'],
|
||||
},
|
||||
|
||||
presets: [
|
||||
[
|
||||
'classic',
|
||||
{
|
||||
docs: {
|
||||
sidebarPath: './sidebars.ts',
|
||||
routeBasePath: '/',
|
||||
editUrl: `${GITHUB_REPO_URL}/edit/main/`,
|
||||
showLastUpdateTime: true,
|
||||
},
|
||||
blog: false, // Disable blog feature
|
||||
sitemap: {
|
||||
lastmod: 'date',
|
||||
priority: null,
|
||||
changefreq: null,
|
||||
},
|
||||
theme: {
|
||||
customCss: './src/css/custom.css',
|
||||
},
|
||||
} satisfies Preset.Options,
|
||||
],
|
||||
],
|
||||
|
||||
themes: [
|
||||
[
|
||||
require.resolve("@easyops-cn/docusaurus-search-local"),
|
||||
{
|
||||
hashed: true,
|
||||
language: ["en"],
|
||||
highlightSearchTermsOnTargetPage: false,
|
||||
explicitSearchResultPath: true,
|
||||
docsRouteBasePath: "/",
|
||||
},
|
||||
],
|
||||
],
|
||||
|
||||
plugins: [
|
||||
...(process.env.POSTHOG_API_KEY ? [
|
||||
[
|
||||
"posthog-docusaurus",
|
||||
{
|
||||
apiKey: process.env.POSTHOG_API_KEY,
|
||||
appUrl: "https://us.i.posthog.com",
|
||||
enableInDevelopment: true,
|
||||
},
|
||||
],
|
||||
] : []),
|
||||
[
|
||||
'@docusaurus/plugin-client-redirects',
|
||||
{
|
||||
redirects: [
|
||||
// Files moved from advanced-usage to features
|
||||
{
|
||||
to: '/features/checkpoints',
|
||||
from: ['/advanced-usage/checkpoints'],
|
||||
},
|
||||
{
|
||||
to: '/features/code-actions',
|
||||
from: ['/advanced-usage/code-actions'],
|
||||
},
|
||||
{
|
||||
to: '/advanced-usage/custom-instructions',
|
||||
from: ['/features/custom-instructions'],
|
||||
},
|
||||
{
|
||||
to: '/features/custom-modes',
|
||||
from: ['/advanced-usage/custom-modes'],
|
||||
},
|
||||
{
|
||||
to: '/features/enhance-prompt',
|
||||
from: ['/advanced-usage/enhance-prompt'],
|
||||
},
|
||||
{
|
||||
to: '/features/experimental/experimental-features',
|
||||
from: ['/advanced-usage/experimental-features'],
|
||||
},
|
||||
{
|
||||
to: '/features/model-temperature',
|
||||
from: ['/advanced-usage/model-temperature'],
|
||||
},
|
||||
{
|
||||
to: '/features/auto-approving-actions',
|
||||
from: ['/advanced-usage/auto-approving-actions'],
|
||||
},
|
||||
{
|
||||
to: '/features/api-configuration-profiles',
|
||||
from: ['/advanced-usage/api-configuration-profiles'],
|
||||
},
|
||||
|
||||
// MCP related redirects
|
||||
{
|
||||
to: '/features/mcp/overview',
|
||||
from: ['/advanced-usage/mcp', '/mcp/overview'],
|
||||
},
|
||||
{
|
||||
to: '/features/mcp/using-mcp-in-kilo-code',
|
||||
from: ['/mcp/using-mcp-in-kilo-code'],
|
||||
},
|
||||
{
|
||||
to: '/features/mcp/what-is-mcp',
|
||||
from: ['/mcp/what-is-mcp'],
|
||||
},
|
||||
{
|
||||
to: '/features/mcp/server-transports',
|
||||
from: ['/mcp/server-transports'],
|
||||
},
|
||||
{
|
||||
to: '/features/mcp/mcp-vs-api',
|
||||
from: ['/mcp/mcp-vs-api'],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
],
|
||||
|
||||
themeConfig: {
|
||||
image: 'img/kilo-v1.svg',
|
||||
navbar: {
|
||||
title: 'Kilo Code',
|
||||
logo: {
|
||||
alt: 'Kilo Code Logo',
|
||||
src: 'img/kilo-v1.svg',
|
||||
srcDark: 'img/kilo-v1-white.svg',
|
||||
href: '/',
|
||||
target: '_self'
|
||||
},
|
||||
items: [
|
||||
{
|
||||
href: GITHUB_MAIN_REPO_URL,
|
||||
label: 'GitHub',
|
||||
position: 'right',
|
||||
},
|
||||
{
|
||||
href: VSCODE_MARKETPLACE_URL,
|
||||
label: 'Install Extension',
|
||||
position: 'right',
|
||||
},
|
||||
{
|
||||
type: 'localeDropdown',
|
||||
position: 'right',
|
||||
},
|
||||
],
|
||||
},
|
||||
footer: {
|
||||
style: 'dark',
|
||||
links: [
|
||||
{
|
||||
title: 'Community',
|
||||
items: [
|
||||
{
|
||||
label: 'Discord',
|
||||
href: DISCORD_URL,
|
||||
},
|
||||
{
|
||||
label: 'Reddit',
|
||||
href: REDDIT_URL,
|
||||
},
|
||||
{
|
||||
label: 'Twitter',
|
||||
href: TWITTER_URL,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'GitHub',
|
||||
items: [
|
||||
{
|
||||
label: 'Issues',
|
||||
href: GITHUB_ISSUES_MAIN_URL,
|
||||
},
|
||||
{
|
||||
label: 'Feature Requests',
|
||||
href: GITHUB_FEATURES_URL,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Download',
|
||||
items: [
|
||||
{
|
||||
label: 'VS Code Marketplace',
|
||||
href: VSCODE_MARKETPLACE_URL,
|
||||
},
|
||||
{
|
||||
label: 'Open VSX Registry',
|
||||
href: OPEN_VSX_URL,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Company',
|
||||
items: [
|
||||
{
|
||||
label: 'Contact',
|
||||
href: CONTACT_EMAIL,
|
||||
target: '_self',
|
||||
},
|
||||
{
|
||||
label: 'Careers',
|
||||
href: CAREERS_URL,
|
||||
},
|
||||
{
|
||||
label: 'Website Privacy Policy',
|
||||
href: WEBSITE_PRIVACY_URL,
|
||||
},
|
||||
{
|
||||
label: 'Extension Privacy Policy',
|
||||
href: EXTENSION_PRIVACY_URL,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
prism: {
|
||||
theme: prismThemes.github,
|
||||
darkTheme: prismThemes.dracula,
|
||||
},
|
||||
} satisfies Preset.ThemeConfig,
|
||||
};
|
||||
|
||||
export default config;
|
||||
@@ -1,362 +0,0 @@
|
||||
{
|
||||
"theme.ErrorPageContent.title": {
|
||||
"message": "页面已崩溃。",
|
||||
"description": "The title of the fallback page when the page crashed"
|
||||
},
|
||||
"theme.BackToTopButton.buttonAriaLabel": {
|
||||
"message": "返回顶部",
|
||||
"description": "The ARIA label for the back to top button"
|
||||
},
|
||||
"theme.blog.archive.title": {
|
||||
"message": "历史博文",
|
||||
"description": "The page & hero title of the blog archive page"
|
||||
},
|
||||
"theme.blog.archive.description": {
|
||||
"message": "历史博文",
|
||||
"description": "The page & hero description of the blog archive page"
|
||||
},
|
||||
"theme.blog.paginator.navAriaLabel": {
|
||||
"message": "博文列表分页导航",
|
||||
"description": "The ARIA label for the blog pagination"
|
||||
},
|
||||
"theme.blog.paginator.newerEntries": {
|
||||
"message": "较新的博文",
|
||||
"description": "The label used to navigate to the newer blog posts page (previous page)"
|
||||
},
|
||||
"theme.blog.paginator.olderEntries": {
|
||||
"message": "较旧的博文",
|
||||
"description": "The label used to navigate to the older blog posts page (next page)"
|
||||
},
|
||||
"theme.blog.post.paginator.navAriaLabel": {
|
||||
"message": "博文分页导航",
|
||||
"description": "The ARIA label for the blog posts pagination"
|
||||
},
|
||||
"theme.blog.post.paginator.newerPost": {
|
||||
"message": "下一篇",
|
||||
"description": "The blog post button label to navigate to the newer/previous post"
|
||||
},
|
||||
"theme.blog.post.paginator.olderPost": {
|
||||
"message": "上一篇",
|
||||
"description": "The blog post button label to navigate to the older/next post"
|
||||
},
|
||||
"theme.tags.tagsPageLink": {
|
||||
"message": "查看所有标签",
|
||||
"description": "The label of the link targeting the tag list page"
|
||||
},
|
||||
"theme.colorToggle.ariaLabel.mode.system": {
|
||||
"message": "跟随系统",
|
||||
"description": "The name for the system color mode"
|
||||
}
|
||||
,
|
||||
"theme.colorToggle.ariaLabel.mode.light": {
|
||||
"message": "浅色模式",
|
||||
"description": "The name for the light color mode"
|
||||
},
|
||||
"theme.colorToggle.ariaLabel.mode.dark": {
|
||||
"message": "深色模式",
|
||||
"description": "The name for the dark color mode"
|
||||
},
|
||||
"theme.colorToggle.ariaLabel": {
|
||||
"message": "切换浅色/深色模式(当前为{mode})",
|
||||
"description": "The ARIA label for the color mode toggle"
|
||||
},
|
||||
"theme.docs.DocCard.categoryDescription.plurals": {
|
||||
"message": "{count} 个项目",
|
||||
"description": "The default description for a category card in the generated index about how many items this category includes"
|
||||
},
|
||||
"theme.docs.breadcrumbs.navAriaLabel": {
|
||||
"message": "页面路径",
|
||||
"description": "The ARIA label for the breadcrumbs"
|
||||
},
|
||||
"theme.docs.paginator.navAriaLabel": {
|
||||
"message": "文档导航",
|
||||
"description": "The ARIA label for the docs pagination"
|
||||
},
|
||||
"theme.docs.paginator.previous": {
|
||||
"message": "上一页",
|
||||
"description": "The label used to navigate to the previous doc"
|
||||
},
|
||||
"theme.docs.paginator.next": {
|
||||
"message": "下一页",
|
||||
"description": "The label used to navigate to the next doc"
|
||||
},
|
||||
"theme.docs.tagDocListPageTitle.nDocsTagged": {
|
||||
"message": "共 {count} 篇文档",
|
||||
"description": "Pluralized label for \"{count} docs tagged\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
|
||||
},
|
||||
"theme.docs.tagDocListPageTitle": {
|
||||
"message": "标签「{tagName}」 - {nDocsTagged}",
|
||||
"description": "The title of the page for a docs tag"
|
||||
},
|
||||
"theme.docs.versions.unreleasedVersionLabel": {
|
||||
"message": "这是 {siteTitle} {versionLabel} 版本的未发布文档。",
|
||||
"description": "The label used to tell the user that he's browsing an unreleased doc version"
|
||||
},
|
||||
"theme.docs.versions.unmaintainedVersionLabel": {
|
||||
"message": "这是 {siteTitle} {versionLabel} 版本的文档,已不再维护。",
|
||||
"description": "The label used to tell the user that he's browsing an unmaintained doc version"
|
||||
},
|
||||
"theme.docs.versions.latestVersionSuggestionLabel": {
|
||||
"message": "请查看最新文档 {latestVersionLink} ({versionLabel})。",
|
||||
"description": "The label used to tell the user to check the latest version"
|
||||
},
|
||||
"theme.docs.versions.latestVersionLinkLabel": {
|
||||
"message": "最新版本",
|
||||
"description": "The label used for the latest version suggestion link label"
|
||||
},
|
||||
"theme.docs.versionBadge.label": {
|
||||
"message": "版本:{versionLabel}"
|
||||
},
|
||||
"theme.common.editThisPage": {
|
||||
"message": "编辑此页",
|
||||
"description": "The link label to edit the current page"
|
||||
},
|
||||
"theme.common.headingLinkTitle": {
|
||||
"message": "{heading}的链接",
|
||||
"description": "Title for link to heading"
|
||||
},
|
||||
"theme.lastUpdated.atDate": {
|
||||
"message": "于 {date} ",
|
||||
"description": "The words used to describe on which date a page has been last updated"
|
||||
},
|
||||
"theme.lastUpdated.byUser": {
|
||||
"message": "由 {user} ",
|
||||
"description": "The words used to describe by who the page has been last updated"
|
||||
},
|
||||
"theme.lastUpdated.lastUpdatedAtBy": {
|
||||
"message": "最后{byUser}{atDate}更新",
|
||||
"description": "The sentence used to display when a page has been last updated, and by who"
|
||||
},
|
||||
"theme.navbar.mobileVersionsDropdown.label": {
|
||||
"message": "选择版本",
|
||||
"description": "The label for the navbar versions dropdown on mobile view"
|
||||
},
|
||||
"theme.NotFound.title": {
|
||||
"message": "找不到页面",
|
||||
"description": "The title of the 404 page"
|
||||
},
|
||||
"theme.tags.tagsListLabel": {
|
||||
"message": "标签:",
|
||||
"description": "The label alongside a tag list"
|
||||
},
|
||||
"theme.AnnouncementBar.closeButtonAriaLabel": {
|
||||
"message": "关闭",
|
||||
"description": "The ARIA label for close button of announcement bar"
|
||||
},
|
||||
"theme.admonition.caution": {
|
||||
"message": "警告",
|
||||
"description": "The default label used for the Caution admonition (:::caution)"
|
||||
},
|
||||
"theme.admonition.danger": {
|
||||
"message": "风险",
|
||||
"description": "The default label used for the Danger admonition (:::danger)"
|
||||
},
|
||||
"theme.admonition.info": {
|
||||
"message": "信息",
|
||||
"description": "The default label used for the Info admonition (:::info)"
|
||||
},
|
||||
"theme.admonition.note": {
|
||||
"message": "备注",
|
||||
"description": "The default label used for the Note admonition (:::note)"
|
||||
},
|
||||
"theme.admonition.tip": {
|
||||
"message": "提示",
|
||||
"description": "The default label used for the Tip admonition (:::tip)"
|
||||
},
|
||||
"theme.admonition.warning": {
|
||||
"message": "注意",
|
||||
"description": "The default label used for the Warning admonition (:::warning)"
|
||||
},
|
||||
"theme.blog.sidebar.navAriaLabel": {
|
||||
"message": "最近博文导航",
|
||||
"description": "The ARIA label for recent posts in the blog sidebar"
|
||||
},
|
||||
"theme.DocSidebarItem.expandCategoryAriaLabel": {
|
||||
"message": "展开侧边栏分类 '{label}'",
|
||||
"description": "The ARIA label to expand the sidebar category"
|
||||
},
|
||||
"theme.DocSidebarItem.collapseCategoryAriaLabel": {
|
||||
"message": "折叠侧边栏分类 '{label}'",
|
||||
"description": "The ARIA label to collapse the sidebar category"
|
||||
},
|
||||
"theme.NavBar.navAriaLabel": {
|
||||
"message": "网站地图",
|
||||
"description": "The ARIA label for the main navigation"
|
||||
},
|
||||
"theme.NotFound.p1": {
|
||||
"message": "我们找不到您要找的页面。",
|
||||
"description": "The first paragraph of the 404 page"
|
||||
},
|
||||
"theme.NotFound.p2": {
|
||||
"message": "请联系原始链接来源网站的所有者,并告知他们链接已损坏。",
|
||||
"description": "The 2nd paragraph of the 404 page"
|
||||
},
|
||||
"theme.TOCCollapsible.toggleButtonLabel": {
|
||||
"message": "目录",
|
||||
"description": "The label used by the button on the collapsible TOC component"
|
||||
},
|
||||
"theme.navbar.mobileLanguageDropdown.label": {
|
||||
"message": "选择语言",
|
||||
"description": "The label for the mobile language switcher dropdown"
|
||||
},
|
||||
"theme.blog.post.readingTime.plurals": {
|
||||
"message": "阅读需 {readingTime} 分钟",
|
||||
"description": "Pluralized label for \"{readingTime} min read\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
|
||||
},
|
||||
"theme.blog.post.readMore": {
|
||||
"message": "阅读更多",
|
||||
"description": "The label used in blog post item excerpts to link to full blog posts"
|
||||
},
|
||||
"theme.blog.post.readMoreLabel": {
|
||||
"message": "阅读 {title} 的全文",
|
||||
"description": "The ARIA label for the link to full blog posts from excerpts"
|
||||
},
|
||||
"theme.CodeBlock.copy": {
|
||||
"message": "复制",
|
||||
"description": "The copy button label on code blocks"
|
||||
},
|
||||
"theme.CodeBlock.copied": {
|
||||
"message": "复制成功",
|
||||
"description": "The copied button label on code blocks"
|
||||
},
|
||||
"theme.CodeBlock.copyButtonAriaLabel": {
|
||||
"message": "复制代码到剪贴板",
|
||||
"description": "The ARIA label for copy code blocks button"
|
||||
},
|
||||
"theme.CodeBlock.wordWrapToggle": {
|
||||
"message": "切换自动换行",
|
||||
"description": "The title attribute for toggle word wrapping button of code block lines"
|
||||
},
|
||||
"theme.docs.sidebar.collapseButtonTitle": {
|
||||
"message": "收起侧边栏",
|
||||
"description": "The title attribute for collapse button of doc sidebar"
|
||||
},
|
||||
"theme.docs.sidebar.collapseButtonAriaLabel": {
|
||||
"message": "收起侧边栏",
|
||||
"description": "The title attribute for collapse button of doc sidebar"
|
||||
},
|
||||
"theme.docs.sidebar.navAriaLabel": {
|
||||
"message": "文档侧边栏",
|
||||
"description": "The ARIA label for the sidebar navigation"
|
||||
},
|
||||
"theme.docs.breadcrumbs.home": {
|
||||
"message": "主页",
|
||||
"description": "The ARIA label for the home page in the breadcrumbs"
|
||||
},
|
||||
"theme.docs.sidebar.closeSidebarButtonAriaLabel": {
|
||||
"message": "关闭导航栏",
|
||||
"description": "The ARIA label for close button of mobile sidebar"
|
||||
},
|
||||
"theme.navbar.mobileSidebarSecondaryMenu.backButtonLabel": {
|
||||
"message": "← 返回主菜单",
|
||||
"description": "The label of the back button to return to main menu, inside the mobile navbar sidebar secondary menu (notably used to display the docs sidebar)"
|
||||
},
|
||||
"theme.docs.sidebar.toggleSidebarButtonAriaLabel": {
|
||||
"message": "切换导航栏",
|
||||
"description": "The ARIA label for hamburger menu button of mobile navigation"
|
||||
},
|
||||
"theme.docs.sidebar.expandButtonTitle": {
|
||||
"message": "展开侧边栏",
|
||||
"description": "The ARIA label and title attribute for expand button of doc sidebar"
|
||||
},
|
||||
"theme.docs.sidebar.expandButtonAriaLabel": {
|
||||
"message": "展开侧边栏",
|
||||
"description": "The ARIA label and title attribute for expand button of doc sidebar"
|
||||
},
|
||||
"theme.navbar.mobileDropdown.collapseButton.expandAriaLabel": {
|
||||
"message": "展开下拉菜单",
|
||||
"description": "The ARIA label of the button to expand the mobile dropdown navbar item"
|
||||
},
|
||||
"theme.navbar.mobileDropdown.collapseButton.collapseAriaLabel": {
|
||||
"message": "折叠下拉菜单",
|
||||
"description": "The ARIA label of the button to collapse the mobile dropdown navbar item"
|
||||
},
|
||||
"theme.SearchPage.existingResultsTitle": {
|
||||
"message": "“{query}”的搜索结果",
|
||||
"description": "The search page title for non-empty query"
|
||||
},
|
||||
"theme.SearchPage.emptyResultsTitle": {
|
||||
"message": "查找文档",
|
||||
"description": "The search page title for empty query"
|
||||
},
|
||||
"theme.SearchPage.searchContext.everywhere": {
|
||||
"message": "所有"
|
||||
},
|
||||
"theme.SearchPage.documentsFound.plurals": {
|
||||
"message": "共找到 {count} 篇文档",
|
||||
"description": "Pluralized label for \"{count} documents found\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
|
||||
},
|
||||
"theme.SearchPage.noResultsText": {
|
||||
"message": "未找到任何文档",
|
||||
"description": "The paragraph for empty search result"
|
||||
},
|
||||
"theme.SearchBar.noResultsText": {
|
||||
"message": "未找到任何文档"
|
||||
},
|
||||
"theme.SearchBar.seeAllOutsideContext": {
|
||||
"message": "查看“{context}”以外的全部结果"
|
||||
},
|
||||
"theme.SearchBar.searchInContext": {
|
||||
"message": "查看“{context}”以内的全部结果"
|
||||
},
|
||||
"theme.SearchBar.seeAll": {
|
||||
"message": "查看全部结果"
|
||||
},
|
||||
"theme.SearchBar.label": {
|
||||
"message": "搜索",
|
||||
"description": "The ARIA label and placeholder for search button"
|
||||
},
|
||||
"theme.blog.post.plurals": {
|
||||
"message": "{count} 篇博文",
|
||||
"description": "Pluralized label for \"{count} posts\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
|
||||
},
|
||||
"theme.blog.tagTitle": {
|
||||
"message": "{nPosts} 含有标签「{tagName}」",
|
||||
"description": "The title of the page for a blog tag"
|
||||
},
|
||||
"theme.blog.author.pageTitle": {
|
||||
"message": "{authorName} - {nPosts}",
|
||||
"description": "The title of the page for a blog author"
|
||||
},
|
||||
"theme.blog.authorsList.pageTitle": {
|
||||
"message": "作者",
|
||||
"description": "The title of the authors page"
|
||||
},
|
||||
"theme.blog.authorsList.viewAll": {
|
||||
"message": "查看所有作者",
|
||||
"description": "The label of the link targeting the blog authors page"
|
||||
},
|
||||
"theme.blog.author.noPosts": {
|
||||
"message": "该作者尚未撰写任何文章。",
|
||||
"description": "The text for authors with 0 blog post"
|
||||
},
|
||||
"theme.contentVisibility.unlistedBanner.title": {
|
||||
"message": "未公开页面",
|
||||
"description": "The unlisted content banner title"
|
||||
},
|
||||
"theme.contentVisibility.unlistedBanner.message": {
|
||||
"message": "此页面未公开。搜索引擎无法索引它,只有通过直接链接的用户才能访问。",
|
||||
"description": "The unlisted content banner message"
|
||||
},
|
||||
"theme.contentVisibility.draftBanner.title": {
|
||||
"message": "草稿页",
|
||||
"description": "The draft content banner title"
|
||||
},
|
||||
"theme.contentVisibility.draftBanner.message": {
|
||||
"message": "此页面是草稿,仅在开发环境中可见,不会包含在正式版本中。",
|
||||
"description": "The draft content banner message"
|
||||
},
|
||||
"theme.ErrorPageContent.tryAgain": {
|
||||
"message": "重试",
|
||||
"description": "The label of the button to try again rendering when the React error boundary captures an error"
|
||||
},
|
||||
"theme.common.skipToMainContent": {
|
||||
"message": "跳转到主要内容",
|
||||
"description": "The skip to content label used for accessibility, allowing to rapidly navigate to main content with keyboard tab/enter navigation"
|
||||
},
|
||||
"theme.tags.tagsPageTitle": {
|
||||
"message": "标签",
|
||||
"description": "The title of the tag list page"
|
||||
}
|
||||
}
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user