slidev icon indicating copy to clipboard operation
slidev copied to clipboard

feat: support Model Context Protocol in VSCode extension

Open MarleneJiang opened this issue 8 months ago • 6 comments

20250324212625

Inspired by vite-pulgin-mcp, I have integrated mcp into the runtime of slidev. When users are using AI to assist in writing slides, they can provide more detailed information to the agent through a series of mcp tools: number, table of contents, formatter, headmatter, etc. By the way, it's time to make the slidev vsc extension great again.

support tools

  • get-current-slide-no: Get current slide number.
  • get-current-slide: Get current slide info.
  • get-slide-by-no: Get slide info by number.
  • get-all-slides: Get all slides info.

even so, it's worth considering whether to make mcp as a Slidev Vite plugin or use webview postSlidevMessage to obtain more runtime information, such as compile layout styles, error messages, and so on.

MarleneJiang avatar Mar 24 '25 13:03 MarleneJiang

Deploy Preview for slidev ready!

Name Link
Latest commit a877f3d84267bcebe49b83fbc3c091d6bc90062a
Latest deploy log https://app.netlify.com/sites/slidev/deploys/67e91b4f3fc2b600087cf85f
Deploy Preview https://deploy-preview-2132--slidev.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] avatar Mar 24 '25 13:03 netlify[bot]

I am not sure how this would be useful. If we only do the parsing, shouldn't that information already be available just by feeding the entire file to LLM? (which should be already available to the agent)

antfu avatar Mar 25 '25 01:03 antfu

I am not sure how this would be useful. If we only do the parsing, shouldn't that information already be available just by feeding the entire file to LLM? (which should be already available to the agent)

You raise a fair point. I think as slides projects get more complex, current agent might struggle. I want to use mcp to boost the agent's processing capabilities, which fits what a VSC extension can do. I spent a few days building a demo.

https://github.com/user-attachments/assets/83a580e6-7544-4e3a-ae37-c1d8c84af7a9

Compared to feeding the entire slides file, mcp works at the slide level for input and editing. Using an agent to generate or optimize complex slides is pretty challenging. Modifying the whole slide file at once needs stronger models. To improve results, we need to reduce complexity. Often when editing one slide, it don't need context from other slides - that's where mcp shines. By providing slide-level context, it breaks down processing tasks into simpler pieces. The agent only needs to focus on one slide at a time, which helps avoid accidentally changing unrelated code.

Also, slide files have reference relationships, plus custom components, themes, layouts, etc. This is typically a multi-file project. Passing the whole file or folder to an agent might make it hard for some models to understand these references. For Cursor, you might need to manually add rules. But mcp can parse out the reference relationships between slides, identify custom components, and provide helpful context. The agent doesn't need to worry about finding slides in different entry files - it can understand the whole presentation sequentially.

Additionally, mcp provides more helper info. For example, it can fetch the latest slidev features via docs, themes and addons via npm, recommend appropriate ones without requiring user input or relying on the model's own outmoded knowledge. This connects to the existing slidev ecosystem and reduces learning curve. Custom themes, components, and layouts can be accessed through mcp without adding code files to the cursor chat context.

Currently, mcp has these tools:

  • get-current-slide-no
  • get-slide: includes specific slide info and project summary
  • get-all-slide: provides complete slides info for the project
  • update-slide
  • insert-slide
  • remove-slide
  • get-slidev-themes
  • get-slidev-addons
  • get-layouts: gets built-in and custom layouts
  • get-components: gets built-in and custom components
  • get-slidev-features
  • get-slidev-feature-usage

Maybe getting md compilation errors or HTML output and feeding them back to the LLM could improve the results.

MarleneJiang avatar Mar 30 '25 10:03 MarleneJiang

🤔 As the VSCode version reaches 1.99, using the vsc LanguageModelTool to make the mcp tool might be a better way instead of an HTTP server.

MarleneJiang avatar Apr 08 '25 07:04 MarleneJiang

Sorry for late reply. I am a bit concerned about the complexity it introduces. Technically, MCP is a completely different feature from the current extension, I am worried about the long-term maintenance if we fuse them together. Do you think you can move the logic to a separate extension under your name, and here we expose the necessary API for cross-extension communication for your extension to get the info? What do you think?

antfu avatar May 19 '25 05:05 antfu

Sorry for late reply. I am a bit concerned about the complexity it introduces. Technically, MCP is a completely different feature from the current extension, I am worried about the long-term maintenance if we fuse them together. Do you think you can move the logic to a separate extension under your name, and here we expose the necessary API for cross-extension communication for your extension to get the info? What do you think?

Sounds great, I'll move the logic over to a new extension under my name that uses the exposed APIs.

MarleneJiang avatar May 19 '25 13:05 MarleneJiang