✨ feat(ai): 完善 MCP 新增参数指引

- 新增 npx MCP 服务模板和启动预览

- 补充 command/args 表单说明与内置指引快照

- 覆盖 MCP 参数草稿、指引和 AI 配置检查测试

frontend/src/utils/aiBuiltinInspectionToolInfo.ts

@@ -133,14 +133,14 @@ export const BUILTIN_AI_INSPECTION_TOOL_INFO: AIBuiltinToolInfo[] = [
     icon: "🧭",
     desc: "查看新增 MCP 的填写指引",
     detail:
-      "返回新增 MCP 表单里各字段的作用、推荐填写顺序、完整命令自动拆分规则，以及 Node / uvx / Python / EXE 模板样例。适合用户问“command/args/env 到底怎么填”“给我一个 node / uvx / python 示例”“为什么启动命令不能整行填”时，先读这份真实接入指引。",
+      "返回新增 MCP 表单里各字段的作用、推荐填写顺序、完整命令自动拆分规则，以及 npx / Node / uvx / Python / EXE 模板样例。适合用户问“command/args/env 到底怎么填”“给我一个 npx / node / uvx / python 示例”“为什么启动命令不能整行填”时，先读这份真实接入指引。",
     params: "无参数",
     tool: {
       type: "function",
       function: {
         name: "inspect_mcp_authoring_guide",
         description:
-          "读取 GoNavi 当前内置的 MCP 新增指引，包括推荐填写顺序、字段作用、常见命令示例、完整命令自动拆分规则，以及 Node / uvx / Python / EXE 模板样例。适用于用户提到新增 MCP 不知道 command、args、env、timeout 怎么填，或想要一个最接近的模板时，先读取这份真实前端接入指南，不要凭记忆口述。",
+          "读取 GoNavi 当前内置的 MCP 新增指引，包括推荐填写顺序、字段作用、常见命令示例、完整命令自动拆分规则，以及 npx / Node / uvx / Python / EXE 模板样例。适用于用户提到新增 MCP 不知道 command、args、env、timeout 怎么填，或想要一个最接近的模板时，先读取这份真实前端接入指南，不要凭记忆口述。",
         parameters: { type: "object", properties: {} },
       },
     },

frontend/src/utils/mcpCommandDraft.test.ts

@@ -70,6 +70,17 @@ describe('mcpCommandDraft helpers', () => {
     });
   });
 
+  it('keeps npx package launches as command plus split args', () => {
+    const result = parseMCPCommandDraft('npx -y @modelcontextprotocol/server-filesystem --stdio C:\\Users\\me\\workspace');
+
+    expect(result.ok).toBe(true);
+    expect(result.draft).toEqual({
+      command: 'npx',
+      args: ['-y', '@modelcontextprotocol/server-filesystem', '--stdio', 'C:\\Users\\me\\workspace'],
+      env: {},
+    });
+  });
+
   it('reports unclosed quotes instead of producing a broken parse', () => {
     expect(splitShellLikeCommand('uvx "broken command')).toEqual({
       tokens: ['uvx'],

frontend/src/utils/mcpServerGuidance.test.ts

@@ -15,6 +15,7 @@ describe('mcpServerGuidance', () => {
     expect(symptoms).toContain('测试提示找不到命令');
     expect(symptoms).toContain('认证失败、401 或 403');
     expect(allGuidance).toContain('命令参数');
+    expect(allGuidance).toContain('command=npx');
     expect(allGuidance).toContain('KEY=VALUE');
     expect(allGuidance).toContain('当前只支持 stdio');
   });
@@ -24,6 +25,7 @@ describe('mcpServerGuidance', () => {
 
     expect(notes).toContain('本机配置');
     expect(notes).toContain('不要把密钥写进聊天内容');
+    expect(notes).toContain('command 填 npx');
     expect(notes).toContain('PowerShell $env:KEY=VALUE;');
     expect(notes).toContain('Windows set KEY=VALUE &&');
   });

frontend/src/utils/mcpServerGuidance.ts

@@ -24,6 +24,7 @@ export interface MCPTroubleshootingGuide {
 }
 
 export const MCP_COMMAND_EXAMPLES = [
+  'npx -y @modelcontextprotocol/server-filesystem --stdio',
   'uvx mcp-server-fetch',
   'node server.js --stdio',
   'python -m your_mcp_server',
@@ -68,17 +69,17 @@ export const MCP_FIELD_GUIDES: MCPFieldGuide[] = [
     key: 'command',
     title: '启动命令',
     summary: '只填程序名或启动器本身。',
-    detail: '常见是 node、uvx、python；脚本名和 --stdio 这类内容放到参数里。',
+    detail: '常见是 npx、node、uvx、python；包名、脚本名和 --stdio 这类内容放到参数里。',
     fieldState: 'required',
-    example: 'node / uvx / python',
+    example: 'npx / node / uvx / python',
   },
   {
     key: 'args',
     title: '命令参数',
     summary: '把脚本名、模块名、开关参数拆开逐项填写。',
-    detail: '例如 node server.js --stdio，要拆成 server.js 和 --stdio 两项。',
+    detail: '例如 npx -y pkg --stdio，要拆成 -y、pkg 和 --stdio；node server.js --stdio 要拆成 server.js 和 --stdio。',
     fieldState: 'optional',
-    example: 'server.js / --stdio / -m / your_mcp_server',
+    example: '-y / @modelcontextprotocol/server-filesystem / --stdio / server.js',
   },
   {
     key: 'env',
@@ -100,6 +101,7 @@ export const MCP_FIELD_GUIDES: MCPFieldGuide[] = [
 
 export const MCP_AUTHORING_NOTES = [
   '启动命令只填程序本身，不要把脚本名、模块名和 --stdio 混进去。',
+  'README 给 npx 示例时，command 填 npx，args 逐项填 -y、包名和 --stdio；不要把整行 npx 命令放进 command。',
   '如果 README 里只给了一整行命令，优先粘到完整命令框自动拆分；支持 KEY=VALUE、env KEY=VALUE、PowerShell $env:KEY=VALUE; 和 Windows set KEY=VALUE && 这几类前缀环境变量写法。',
   '环境变量每行一条 KEY=VALUE，不要写 export，也不要和启动命令混成一行保存。',
   '密钥类环境变量会保存到本机配置，并只在启动 MCP 进程时作为进程环境传入；不要把密钥写进聊天内容。',
@@ -112,7 +114,7 @@ export const MCP_TROUBLESHOOTING_GUIDES: MCPTroubleshootingGuide[] = [
     symptom: '测试提示找不到命令',
     likelyCause: '启动命令填了整串命令、命令没加入 PATH，或 Windows 路径里有空格但没有用真实 exe 路径。',
     fix: '启动命令只填可执行程序本身；脚本名和 --stdio 放到命令参数里。命令不在 PATH 时，直接填绝对路径。',
-    example: 'command=node, args=server.js / --stdio',
+    example: 'command=npx, args=-y / @modelcontextprotocol/server-filesystem / --stdio',
   },
   {
     key: 'timeout-or-no-tools',

frontend/src/utils/mcpServerTemplates.ts

@@ -9,6 +9,19 @@ export interface MCPServerDraftTemplate {
 }
 
 export const MCP_SERVER_DRAFT_TEMPLATES: MCPServerDraftTemplate[] = [
+  {
+    key: 'npx',
+    title: 'npx 包',
+    description: '适合 README 里写着 `npx -y xxx --stdio` 的 npm MCP 包。',
+    detail: '示例会填成 `npx -y @modelcontextprotocol/server-filesystem --stdio`，把包名和路径参数改成实际值。',
+    seed: {
+      name: 'npx 包',
+      command: 'npx',
+      args: ['-y', '@modelcontextprotocol/server-filesystem', '--stdio'],
+      env: {},
+      timeoutSeconds: 20,
+    },
+  },
   {
     key: 'uvx',
     title: 'uvx 工具',