AI Development Practice: Create a VSCode Plugin in 10 Minutes with Cline and DeepSeek V3

Using Cline and DeepSeek V3, develop a functional VSCode plugin that integrates any directory or file into a prompt format suitable for submission to large language models like GPT and Claude.

The plugin has been officially released, and the plugin address is:

https://marketplace.visualstudio.com/items?itemName=decker502.repoprompt

The following is a complete sharing of the development process.

Project Background

We aim to develop a plugin that can support the following core requirements:

1. Clear Functional Requirements

  • Project Structure and File Integration

    • Support selecting single or multiple files/folders in the VSCode Explorer
    • Recursively scan the selected folders to obtain the complete project structure
    • Integrate the project structure and file content into an XML file
  • Intelligent Content Processing

    • Automatically generate file content summaries

    • Support large file processing (files exceeding the configured size will only keep the summary)

    • Automatically chunk large projects (automatically split into multiple XML files)

  • Flexible Configuration Options

    • Configurable patterns for ignored files and folders

    • Customizable XML root tags

    • Set maximum file size limits

    • Control whether to include comments

3. Code Implementation

Initialize the VSCode plugin project using the yo command line, with AI automatically generating code throughout the process.

yo command line tool installation:

npm install -g yo

Run:

yo

The initialization command is executed as follows:

AI Development Practice: Create a VSCode Plugin in 10 Minutes with Cline and DeepSeek V3

Final Function Overview

  1. Support Right-Click Operations: Users can directly call the plugin function by right-clicking in the Explorer.

  2. Chunked Output: Automatically handle oversized files by splitting them into multiple parts for output.

  3. Path Normalization: Ensure that the output file’s path information is consistent with the project context.

  4. Ignore Patterns: Users can specify ignore rules in the .vscode/settings.json configuration file.

The generated XML file structure is as follows:

<project>  <prompt><![CDATA[  User input prompt (if any)  ]]></prompt>  <structure>    <folder name="root">      <folder name="src">        <file name="example.ts" path="src/example.ts" />      </folder>    </folder>  </structure>  <files>    <file path="src/example.ts">      <summary><![CDATA[      File content summary...      ]]></summary>      <content><![CDATA[      Complete file content...      ]]></content>    </file>  </files></project>

Conclusion

During the development process, having assistants like Cline and DeepSeek V3 helped immensely, making it feel like driving a fully automated car, both efficient and exhilarating! Below are my thoughts on these tools.

  1. Efficient and Effortless: Just a simple description of requirements, and the AI tools can automatically generate code within minutes, even helping you resolve compilation and runtime errors, pinpointing issues, and providing modification suggestions, eliminating the hassle of manual debugging. Moreover, tedious tasks like environment setup and dependency installation are also handled by it. It feels fantastic; you just need to provide a direction, and complex functionalities seem ready-made, easily accomplished!

  2. Source of Inspiration and Creativity: These tools are not just code generators; they are sources of inspiration. When you describe your needs, they can actively propose new ideas and even provide code optimization suggestions, helping you do better. Additionally, code comments and documentation can be automatically generated, saving time and effort, and making future maintenance easier. It feels like you are not just a developer but a conductor leading these tools in a symphony of technology.

  3. Fast Feedback, Rapid Iteration: One of AI’s greatest advantages is its immediacy. During the development process, it can adjust the code in real-time based on changing requirements, even helping you write test scripts to automatically detect potential issues. The development process feels like rapid iteration, with feedback at every step, and the whole process is as smooth as playing a game—nothing feels better than this!

  4. Eliminate Repetition, Focus on Creativity: Many repetitive tasks in traditional development, such as path conversion, data cleaning, and boundary checking, can be handled by tools. This allows you to concentrate on creative work. Need to quickly validate an idea? AI helps you prototype; facing a complex problem? It can assist you in debugging to find the best solution. No more worries about trivial matters; you can fully immerse yourself in innovation.

  5. Sense of Future and Achievement: Another charm of AI tools is that they make development feel futuristic. What used to take days or even weeks can now be accomplished in just a few hours. Every successful run is a result of your joint efforts with AI, and that sense of accomplishment is indescribable—it’s exhilarating!

If you found this article helpful, please like, share, and comment, as this will be the strongest motivation for me to continue producing more quality articles!

Scan to follow for more technical insights!

Add WeChat to receive prompts and recordings used during the implementation process.

“AI Code Power Field,” exploring the infinite possibilities of AI and programming!

AI Development Practice: Create a VSCode Plugin in 10 Minutes with Cline and DeepSeek V3
AI Development Practice: Create a VSCode Plugin in 10 Minutes with Cline and DeepSeek V3

Leave a Comment