fix: correct claude mcp add arg order in all docs and UI

The -H/--header flag is variadic and swallows subsequent positional
args when placed before them. Move name and URL before flags so the
CLI parses correctly. Also update docs from npx mcp-remote to native
HTTP transport.
This commit is contained in:
Ajax Davis 2026-02-07 20:53:01 +10:00
parent 36598fec61
commit a9e01fe772
5 changed files with 13 additions and 13 deletions

View file

@ -127,7 +127,7 @@ function McpUrlSection({
};
// Claude Code CLI command (correct arg order: options before name and url)
const claudeCodeCommand = `claude mcp add --transport http tpmjs-${slug} ${httpUrl}`;
const claudeCodeCommand = `claude mcp add tpmjs-${slug} ${httpUrl} -t http`;
// Claude Desktop native HTTP config
const configSnippet = `{

View file

@ -370,7 +370,7 @@ export default function CollectionDetailPage(): React.ReactElement {
const sseUrl = `${baseUrl}/api/mcp/${collection.user.username}/${collection.slug}/sse`;
// Claude Code CLI command (correct arg order: options before name and url)
const claudeCodeCommand = `claude mcp add --transport http --header "Authorization: Bearer YOUR_TPMJS_API_KEY" ${collection.slug} ${httpUrl}`;
const claudeCodeCommand = `claude mcp add ${collection.slug} ${httpUrl} -t http -H "Authorization: Bearer YOUR_TPMJS_API_KEY"`;
// Claude Desktop native HTTP config
const configSnippet = `{

View file

@ -1308,8 +1308,8 @@ export TPMJS_EXECUTOR_URL=https://executor.mycompany.com`}
<CodeBlock
language="bash"
code={`claude mcp add tpmjs-my-collection \\
-- npx mcp-remote https://tpmjs.com/api/mcp/<username>/<collection-slug>/http \\
--header "Authorization: Bearer YOUR_TPMJS_API_KEY"`}
https://tpmjs.com/api/mcp/<username>/<collection-slug>/http \\
-t http -H "Authorization: Bearer YOUR_TPMJS_API_KEY"`}
/>
<p className="text-foreground-secondary mt-4">
This automatically adds the server to your Claude Code configuration.

View file

@ -802,8 +802,8 @@ Invalid usernames:
<CodeBlock
language="bash"
code={`claude mcp add tpmjs-my-collection \\
-- npx mcp-remote https://tpmjs.com/api/mcp/YOUR_USERNAME/YOUR_COLLECTION_SLUG/http \\
--header "Authorization: Bearer YOUR_TPMJS_API_KEY"`}
https://tpmjs.com/api/mcp/YOUR_USERNAME/YOUR_COLLECTION_SLUG/http \\
-t http -H "Authorization: Bearer YOUR_TPMJS_API_KEY"`}
/>
</DocSubSection>
</DocSection>

View file

@ -41,14 +41,14 @@ export function InstallationSection({
const mcpUrl = `${baseUrl}/@${username}/collections/${collection.slug}/mcp`;
// Build the claude mcp add command
// Options must come before <name> <url>
// Positional args (name, url) must come before flags to avoid -H swallowing them
const commandParts = ['claude mcp add'];
commandParts.push('--transport http');
if (isPrivate) {
commandParts.push('--header "Authorization: Bearer YOUR_TPMJS_API_KEY"');
}
commandParts.push(collection.slug);
commandParts.push(mcpUrl);
commandParts.push('-t http');
if (isPrivate) {
commandParts.push('-H "Authorization: Bearer YOUR_TPMJS_API_KEY"');
}
const installCommand = commandParts.join(' \\\n ');
@ -90,8 +90,8 @@ export function InstallationSection({
const copyCommand = async () => {
// Copy the flat command (without line breaks for easy pasting)
const flatCommand = isPrivate
? `claude mcp add --transport http --header "Authorization: Bearer YOUR_TPMJS_API_KEY" ${collection.slug} ${mcpUrl}`
: `claude mcp add --transport http ${collection.slug} ${mcpUrl}`;
? `claude mcp add ${collection.slug} ${mcpUrl} -t http -H "Authorization: Bearer YOUR_TPMJS_API_KEY"`
: `claude mcp add ${collection.slug} ${mcpUrl} -t http`;
await navigator.clipboard.writeText(flatCommand);
setCopiedCommand(true);