Closed14

MCP サーバーを作ってみる

まっつーまっつー

サーバーインスタンスを作成

const server = new McpServer({
  name: "weather",
  version: "1.0.0",
  capabilities: {
    tools: {},
  },
});

ツールを定義する

server.tool(
  "get-forecast",
  "Get weather forecast for a location",
  {
    latitude: z.number().min(-90).max(90).describe("Latitude of the location"),
    longitude: z.number().min(-180).max(180).describe("Longitude of the location"),
  },
  async ({ latitude, longitude }) => {
    // 処理を書く
  }
)
まっつーまっつー

.cursor/mcp.json に MCP サーバーの設定を書く。

  • 名前: weather
  • 実行するコマンド: node
  • 引数: build 後の実行ファイルへの絶対パス
{
    "mcpServers": {
        "weather": {
            "command": "node",
            "args": [
                "/ABSOLUTE/PATH/TO/PARENT/FOLDER/weather/build/index.js"
            ]
        }
    }
}
まっつーまっつー

.cursor/mcp.json に以下の設定を追加。

{
	"mcpServers": {
		"eslint": {
			"command": "npx",
			"args": ["eslint", "--mcp"],
			"env": {}
		}
	}
}
eslint.config.js
import css from "@eslint/css";

const eslintConfig = [
  {
    files: ["**/*.css"],
    language: "css/css",
    ...css.configs.recommended,
    rules: {
      "css/no-empty-blocks": "error",
      "css/no-invalid-properties": "error",
    },
  },
];

export default eslintConfig;
test.css
/* no-empty-block */
a{}
a {}
a { }
a {  }
a {
}

/* no-invalid-properties */
a {
  color: 1px;
  height: red;
  width: red;
}

Tool で Lint を実行して、その内容に基づいて自動修正を行ってくれる。

まっつーまっつー

できてそう🎉

.styelintrc.json
{
  "rules": {
    "block-no-empty": true,
    "declaration-property-value-no-unknown": true
  }
}
test.css
/* block-no-empty */
a{}
a {}
a { }
a {  }
a {
}

/* declaration-property-value-no-unknown */
a {
  color: 1px;
  height: red;
  width: red;
}

Lint の結果から無理矢理修正させようとすると適当な値が入って使い物にならなそうだから、--fix を実行する Tool も追加しても良いかもしれない。

このスクラップは4ヶ月前にクローズされました