Configure MCP Servers on VSCode, Cursor & Claude Desktop

The Model Context Protocol (MCP) is revolutionizing how Large Language Models (LLMs) interact with external data and tools. By establishing a standardized communication layer, MCP empowers AI to go beyond its training data and access real-time information, utilize specialized functionalities, and ultimately become more versatile and helpful. This article will guide you through the process of configuring MCP servers within three popular development and AI interaction environments: Visual Studio Code (VSCode), Cursor (an AI-first code editor), and Claude Desktop (Anthropic’s desktop application for interacting with Claude).

🧩 Understanding MCP Servers

Before diving into the configuration process, let’s briefly recap what MCP servers are. An MCP server is a service that exposes specific capabilities or data through the MCP protocol. These “tools” can range from fetching weather information to interacting with databases, managing files, or even controlling external applications. By running and connecting to MCP servers, you extend the capabilities of your AI clients.

🔹 How to use the weather MCP Server

In this article, we are going to use the pre-built weather MCP server from one of the quickstart. Please follow the below steps:

Clone the repo https://github.com/modelcontextprotocol/quickstart-resources/tree/main
Open the weather-server-typescript and make sure you have node js installed
Run npm install and make sure all the dependencies are installed without any issue.
I had used node version 18.20.4 and the dependencies were installed without any issue
Run npm run build to build the code. Once the code is build, you should be able to see the build directory and index.js
Make sure you note down the full path of the index.js inside the build directory.

⚙️ Configuring MCP Servers on Visual Studio Code (VSCode)

VSCode offers built-in support for interacting with MCP servers, making it seamless for developers to integrate AI-powered assistance with their coding workflows.

Reference link – https://code.visualstudio.com/docs/copilot/chat/mcp-servers

Steps to Configure:

Install the Required Extension (if not already installed): VSCode’s MCP support is part of the “GitHub Copilot Chat” extension. Ensure this extension is installed and enabled in your VSCode.
- Navigate to the Extensions view (Ctrl+Shift+X or Cmd+Shift+X).
- Search for “GitHub Copilot Chat”.
- If not installed, click the “Install” button.
Update the workspace or user settings as shown below
- Enable Chat > Mcp > Discovery – To automatically discover the tools provided by the MCP servers
- Chat > Mcp – To enable the MCP servers in the chat window.
- Mcp – Edit in settings.json where it says 1 is where we need to add the servers. (You have the option to update either in user or workspace settings)

You should update the settings.json like the below. The path to the index.js should be the full path.

Below is the screenshot of the response from Github Copilot in VS Code without the MCP server

Below is the screenshot with MCP server

It will ask for authorization to execute the tool(method) from the MCP server. Click Continue to give access to Github Copilot to execute the method to get the weather information.
Once the information is received, then the LLM will process the information and will display the result as a friendly response to the users as shown below. You should be able to see the raw response as well.

🛠️ Configuring MCP Servers on Cursor

Cursor, being an AI-first code editor built on top of VSCode, inherits its MCP server configuration capabilities directly. The process for configuring MCP servers in Cursor is identical to that in VSCode.

Reference link – https://docs.cursor.com/context/model-context-protocol

Steps for Cursor:

Go to the Cursor settings and choose MCP on the left navigation
Click Add new global MCP server as shown below

It will open the mcp.json file and update the file as shown below with the same configuration like you did it for VS Code.

Once the server is added, if you navigate to the MCP settings again, you should see the server with tools shown like the below. Here you have the option to enable or disable the MCP server.

Below is the chat result without the MCP server

Sometimes based on the location requested, the default chat without the MCP server will be able to respond but most of the times, it will not have access to the weather data.
Below is the chat results with MCP servers

If it is not enabled to run automatically, for each execution of the tool, you should authorize the tool.

☁️ Configuring MCP Servers on Claude Desktop

Anthropic’s Claude Desktop application also supports connecting to MCP servers, extending the conversational AI’s capabilities. The configuration process is similar in concept but might involve a slightly different mechanism depending on updates to the application. As of the current information, Claude Desktop looks for MCP server configurations in a specific location on your system.

Reference link – https://modelcontextprotocol.io/quickstart/server#test-with-commands

Follow the steps:

Locate the Claude Desktop Configuration Directory: The exact location of this directory might depend on your operating system. A common place to look would be within your user’s application data directory (e.g., ~/.config on Linux/macOS, %APPDATA% on Windows) under a folder related to Claude or Anthropic. Refer to Claude Desktop’s documentation for the most up-to-date location.

Update the config with the pre-built MCP servers like the screenshot shown below

Once updated, quit and re-open the Claude desktop again to see the servers updated as shown below

Below is the screenshot when the MCP servers are not configured

Below are the tools that you can view when the MCP servers are configured

Below are the results when we ask the same question. It will ask for authorization and then it will execute the tool for result.

✅ Conclusion

I hope you all can achieve the same by following this article. One important thing to notice is that we used the same configuration across different IDE and Desktop application to get the desired response and thats the beauty of the MCP server. In future, we will see more examples and also walkthrough on how to develop MCP server and MCP clients.

Happy Coding…