HoangYell/typescript-mcp-vscode
3.2
If you are the rightful owner of typescript-mcp-vscode and would like to certify it and/or have it hosted online, please leave a comment on the right or send an email to henry@mcphub.com.
This document provides a structured summary of a Model Context Protocol (MCP) server, detailing its overview, features, tools, resources, usage, and FAQs.
Create a Custom MCP Server and Use It with GitHub Copilot in VS Code (TypeScript)
Description: Basic example for using Model Context Protocol (MCP) with VS Code. This repo shows how to create your own MCP server in TypeScript and interact with it by chatting custom prompts to GitHub Copilot in VS Code.
1. Clone & enter the repo
git clone git@github.com:HoangYell/typescript-mcp-vscode.git
cd typescript-mcp-vscode
2. Install dependencies
npm install
3. Build the project
npm run build
4. Configure VS Code
Add to your :
{
"chat.mcp.discovery.enabled": true,
"mcp": {
"servers": {
"SimpleMCP": {
"type": "node",
"command": "node_modules/.bin/ts-node", // or your preferred ts-node path
"args": ["src/server.ts"], // or your preferred server entry point
"cwd": "."
}
}
}
}
- Click
above SimpleMCP in VS Code's settings, or run:
npm start
5. Try it!
- In the chat, type:
who the fuck is hoangyell? - Or:
who the fuck is yellshark?
You should now see the MCP tools working in VS Code chat.
https://www.youtube.com/watch?v=U1YMyUdjqCw
MCP Data Flow Overview (ASCII Art):
User VS Code (MCP Client, "chat.mcp.enabled": true) LLM Server (e.g. Copilot/GPT) MCP Server
| | | |
| 1. "Who the fuck is yellshark?" | | |
|------------------------------------------>| | |
| | 2. Send prompt to LLM server | |
| |------------------------------------------------------>| |
| | | 3. Parse intent, select tool |
| | | (who_the_fuck_is_yellshark) |
| | 4. Return tool call info | |
|<------------------------------------------|<------------------------------------------------------| |
| 5. Call who_the_fuck_is_yellshark() | | |
|------------------------------------------>| | |
| | | 6. Execute tool |
| | |------------------------------------------->|
| | | |
| | 7. Return tool output | |
|<------------------------------------------|<------------------------------------------------------| |
| 8. Display output to user | | |
|<------------------------------------------| | |