返回 MCP 目录
public公开dns本地运行

mcp-client-server-demo

React + TypeScript + Vite 项目模板,提供快速开发环境配置,支持热更新和ESLint规则。

article

README

🚀 React + TypeScript + Vite

本模板为使用 Vite 快速开启 React 项目提供了最小化配置,具备 HMR(热模块替换)功能,并包含了一些 ESLint 规则。

目前有两个官方插件可供使用:

🚀 快速开始

此模板提供了使用 Vite 快速入门 React 的最小化设置,带有 HMR(热模块替换)和一些 ESLint 规则。你可以根据需求选用官方插件实现快速刷新。

✨ 主要特性

  • 提供最小化配置,可快速开启 React 项目。
  • 支持 HMR(热模块替换),提升开发效率。
  • 包含 ESLint 规则,保证代码质量。
  • 有两个官方插件可供选择,实现快速刷新。

📚 详细文档

扩展 ESLint 配置

如果你正在开发一个生产应用,我们建议你更新配置以启用类型感知的 lint 规则:

1. 在顶级 parserOptions 属性中进行如下设置

export default tseslint.config({
  languageOptions: {
    // 其他选项...
    parserOptions: {
      project: ['./tsconfig.node.json', './tsconfig.app.json'],
      tsconfigRootDir: import.meta.dirname,
    },
  },
})

2. 替换配置项

tslint.configs.recommended 替换为 tslint.configs.recommendedTypeCheckedtslint.configs.strictTypeChecked

3. 可选配置

可选地添加 ...tslint.configs.stylisticTypeChecked

4. 安装并更新配置

安装 eslint-plugin-react 并更新配置:

// eslint.config.js
import react from 'eslint-plugin-react'

export default tseslint.config({
  // 设置React版本
  settings: { react: { version: '18.3' } },
  plugins: {
    // 添加React插件
    react,
  },
  rules: {
    // 其他规则...
    // 启用它的推荐规则
    ...react.configs.recommended.rules,
    ...react.configs['jsx-runtime'].rules,
  },
})
help

运行方式说明

cloud

托管运行

托管运行通常表示这个 MCP Server 由服务方环境承载,用户一般按页面提供的连接方式或授权流程接入,不需要在本地长期启动一个 MCP 进程

  1. 打开服务方连接页
  2. 完成授权或复制端点
  3. 在 MCP 客户端中连接
terminal

本地运行 / 其它方式

本地运行通常需要用户在自己的电脑或服务器上安装依赖,把 server_config 复制到 MCP 客户端,并按 env_schema 补齐环境变量、密钥或其它配置

  1. 复制 server_config
  2. 安装所需依赖
  3. 补齐环境变量后重启客户端