The era of AI-assisted coding has arrived. However, many developers are wondering, “Which tools should I use and how?” This article provides a beginner-friendly guide on how to dramatically improve your development workflow by integrating the Gemini CLI, which allows you to use Google’s powerful AI model “Gemini” from the command line, with the popular code editor, Visual Studio Code (VS Code).
By reading this article, you will learn:
- The specific steps to integrate Gemini CLI with VS Code.
- How to seamlessly use AI chat and code generation (Agent Mode) within VS Code.
- Advanced customization methods, such as integrating your own custom tools.
Why is Integrating Gemini CLI with VS Code Important?
Developers spend most of their time in their editor and terminal. By seamlessly integrating these two, you can significantly reduce the cost of context switching.
By integrating Gemini CLI into VS Code, you can get AI assistance without leaving your editor, including:
- Code auto-generation and completion: Let the AI handle tedious boilerplate code and complex algorithms.
- Code explanation and refactoring: Understand the intent of existing code or improve it.
- Error resolution: Identify the cause of errors and get solutions.
- Test code generation: Automate the creation of tedious test code.
It’s like having an experienced pair programmer by your side at all times.
Two Integration Methods: Which is Right for You?
There are two main ways to integrate Gemini CLI with VS Code. Understand the features of each and choose the method that suits you best.
| Method | Features | Recommended For |
|---|---|---|
| ① Gemini Code Assist Extension (Recommended) | Enables AI chat and code generation (Agent Mode) within VS Code. The easiest and most feature-rich option. | Most developers |
| ② Integrated Terminal | Run `gemini` commands directly in the VS Code terminal. Simple and requires no extensions. | Those who prefer a simple environment |
Personally, I strongly recommend the ① Gemini Code Assist extension. It’s fully integrated into the VS Code UI, making interaction with the AI very smooth. This extension works by calling the Gemini CLI internally, allowing you to take full advantage of the CLI’s powerful features.
Setup in 3 Easy Steps!
Let’s get started with the setup. Here, we’ll explain how to use the recommended “Gemini Code Assist extension” method.
Step 1: Install Prerequisites
First, install Node.js and the Gemini CLI on your PC, and log in with your Google account.
# Node.js 16 or higher is recommended
npm install -g @google/gemini-cli
# A browser will open for you to authenticate with your Google account
gemini loginNote for Enterprise Use:
If you want to prevent your input data from being used for AI model training in a corporate environment, set the Vertex AI API key as an environment variable. This will protect your data’s privacy.
export GEMINI_API_KEY=...
Step 2: Install the VS Code Extension
- VS Code Insiders is recommended: It’s recommended to use the Insiders version as it gets the latest features like Agent Mode first (though it works fine on the regular version too).
- In the VS Code Extensions view (the square icon in the sidebar), search for “Gemini Code Assist” and install it.
- Open the command palette with
Cmd/Ctrl + Shift + P, run “Gemini: Sign in / Select Model“, and log in with the same Google account as the CLI.
Step 3: Enable Agent Mode
Agent Mode is a powerful feature that understands your instructions and automates file operations, command execution, and more.
- Go to VS Code
Settings>AI Features>Gemini › Agent: Enableand turn it on. - If the extension doesn’t automatically recognize the Gemini CLI, manually set the absolute path from the `which gemini` command in “
Gemini › Agent: Cli Path“.
That’s it for the basic setup!
Go a Step Further: Accelerate Development with Customization
The true value of the Gemini CLI lies in its extensibility.
Integrate Custom Tools
By placing your own custom tools (TypeScript/JavaScript files) in the root of your workspace or in the `~/.gemini/extensions` directory, you can call your own functions from Agent Mode.
For example, you can create a custom code formatting tool called `my-linter.ts` and have it run by simply asking in the chat, “Format this code.” This allows you to delegate project-specific rules and tasks to the AI.
Integrate with VS Code Tasks
By registering frequently used commands like `gemini test` in your VS Code `tasks.json` file, you can run them with a single shortcut key. This further streamlines your daily repetitive tasks.
Conclusion: Evolving as a Developer with AI
In this article, we’ve explained how to integrate Gemini CLI with VS Code to maximize the power of AI.
- Seamless Integration: The VS Code extension allows you to comfortably use AI chat and Agent Mode within your editor.
- CLI at the Core: The extension is built on the CLI, and by leveraging the CLI’s extensibility, you can endlessly automate your development workflow.
- Flexible Usage Plans: The free tier is sufficient for personal learning and small-scale use, but for serious team development, consider using a Vertex AI key or a paid plan.
AI is not here to take away developers’ jobs, but to free them from tedious tasks and allow them to focus on more creative work. Use this guide to incorporate Gemini into your development environment and experience the future of coding.
Leave a Reply