> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.knapsack.cloud/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.knapsack.cloud/_mcp/server.

# Configuring VS Code

## Getting Started with Knapsack MCP + VS Code

Before we can begin configuration you'll need to install and setup VS Code (version 1.101 or later). Download the latest version of VS Code from Microsoft:

[https://code.visualstudio.com/download](https://code.visualstudio.com/download)

**If your organization maintains an allowlist or registry of approved MCP servers, be sure to add your Knapsack MCP site's workspace ID to this URL:** `https://mcp.knapsack.cloud/mcp/<workspace-id>`

#### Finding your workspace ID

To find your **workspace ID**, find the URL of your Knapsack site and look for what comes between `site /` and `/ latest`.

Below is an example of how we at Knapsack would find our workspace ID:

![Example of where to find your site's workspace ID](https://fdr-prod-docs-files-public.s3.us-east-1.amazonaws.com/knapsack-docs.docs.buildwithfern.com/4e2fb921a350ef77bf60fab18a06ec365ce0ccffe301b56b0958aa9f873861a0/docs/assets/images/3a924d36-site-id.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA6KXJSKKNFOCF7G4B%2F20260724%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20260724T211044Z&X-Amz-Expires=604800&X-Amz-Signature=52f37bcfcd7c079a86af136098832df8ca771e3443a7f2a07979a20e1d4a38ad&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject)

Our MCP URL would be `https://mcp.knapsack.cloud/mcp/toby`

***

## Prerequisites

* Knapsack MCP requires a local `Node.js v20` or later to run successfully.
* **Note:** There are many third-party and system-level methods and tools for managing node versions.
  * You can check and manage your Node version using nvm (Node Version Manager), as shown in the example below.

#### Check your Node version

```bash
node -v
```

#### If your version is lower than 20, install and set Node 20 as your default

```bash
nvm install 20
nvm use 20
nvm alias default 20
```

#### Confirm your active version

```bash
node -v
```

***

## Setup Instructions

After installing VS Code in the Getting Started section, we can move onto our configuration.

#### Step 1) Obtain MCP Server URL

Construct your MCP server URL using the format below. Replace `{workspaceID}` with your Knapsack workspace ID.

`https://mcp.knapsack.cloud/mcp/{workspaceID}`

Example:

`https://mcp.knapsack.cloud/mcp/toby`

#### Step 2) Open the Command Palette in VS Code

1. Open the command palette
   1. **Mac:** `Cmd + Shift + P`
   2. **Windows/Linux:** `Ctrl + Shift + P`
2. Type `mcp` and select **Add Server** from the dropdown.

#### Step 3) Select HTTP Server Protocol

When prompted, choose **HTTP Server** as the protocol.

#### Step 4) Enter MCP Server URL

Paste your Knapsack MCP server URL from Step 1 and assign a name to it (e.g., `knapsack-toby`) for easy identification.

#### Step 5) Choose Installation Scope

Select whether you want to install the MCP configuration **globally** or **for the current workspace only.**

#### Step 6) Authenticate Your Account

After saving, VS Code will prompt you to authenticate. Click "Allow" to proceed.

* If you've previously authenticated, select your existing account.
* Otherwise, log in with your organization's authentication method (e.g., SAML, Microsoft 365).

**Trouble authenticating?** Restart VS Code and try again. You can use the command palette to list MCP servers and start the server you created in the steps above.

#### Step 7) Verify MCP Server Setup

After authentication, confirm the new server is available.

You should see the tool listed in Copilot (e.g., knapsack-\{workspace-id}-mcpserver).

#### Step 8) Use Copilot with MCP Server

Once connected, Copilot can use your Knapsack MCP server as a context source.

For example, you can ask:

> "List all available design tokens from my Knapsack workspace."

**When you use an MCP tool for the first time, Copilot will ask for permission. Choose whether to allow it for:**

* The current **session**
* The current **workspace**
* Or **always**

***

## Troubleshooting

If something isn't working, try these steps:

* **Check the logs:**
  Errors usually reference the log file location. Review the logs for details.
* **Early Access not enabled:**
  Ensure your workspace has MCP access enabled; otherwise, the connection will fail.
* **Old Node version:**
  MCP requires Node 20. Use `nvm` to uninstall older versions and set Node 20 as both your current and default.
* **Trouble authenticating:**
  Restart VS Code and try again. You can use the command palette to list MCP servers and start the server you created in the setup instructions.