update
This commit is contained in:
parent
d89ba35c55
commit
160ca6dfd1
@ -1,33 +1,37 @@
|
||||
import { defineConfig } from 'vitepress'
|
||||
|
||||
export default defineConfig({
|
||||
title: "OpenMCP",
|
||||
description: "为开发者和科研人员准备的MCP开发环境和SDK",
|
||||
themeConfig: {
|
||||
// https://vitepress.dev/reference/default-theme-config
|
||||
nav: [
|
||||
{ text: 'Home', link: '/' },
|
||||
{ text: 'Examples', link: '/markdown-examples' }
|
||||
],
|
||||
title: "OpenMCP",
|
||||
description: "为开发者和科研人员准备的MCP开发环境和SDK",
|
||||
head: [
|
||||
['link', { rel: 'icon', href: '/images/favicon.png' }]
|
||||
],
|
||||
themeConfig: {
|
||||
// https://vitepress.dev/reference/default-theme-config
|
||||
nav: [
|
||||
{ text: 'Home', link: '/' },
|
||||
{ text: 'Examples', link: '/markdown-examples' }
|
||||
],
|
||||
|
||||
sidebar: [
|
||||
{
|
||||
text: 'Examples',
|
||||
items: [
|
||||
{ text: 'Markdown Examples', link: '/markdown-examples' },
|
||||
{ text: 'Runtime API Examples', link: '/api-examples' }
|
||||
]
|
||||
}
|
||||
],
|
||||
sidebar: [
|
||||
{
|
||||
text: 'Examples',
|
||||
items: [
|
||||
{ text: 'Markdown Examples', link: '/markdown-examples' },
|
||||
{ text: 'Runtime API Examples', link: '/api-examples' }
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
socialLinks: [
|
||||
{ icon: 'github', link: 'https://github.com/vuejs/vitepress' }
|
||||
],
|
||||
footer: {
|
||||
message: '缩短LLM到Agent的最后一公里'
|
||||
},
|
||||
|
||||
// 添加右侧图片配置
|
||||
logo: '/openmcp.png', // 确保图片放在public目录下
|
||||
}
|
||||
socialLinks: [
|
||||
{ icon: 'github', link: 'https://github.com/vuejs/vitepress' }
|
||||
],
|
||||
footer: {
|
||||
message: '缩短LLM到Agent的最后一公里',
|
||||
copyright: 'OpenMCP All rights reserved'
|
||||
},
|
||||
|
||||
// 添加右侧图片配置
|
||||
logo: '/images/openmcp.png', // 确保图片放在public目录下
|
||||
}
|
||||
})
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<img class="VPImage image-src" src="/openmcp.png" alt="">
|
||||
<div style="height: 420px;">
|
||||
<img class="VPImage image-src" src="/images/openmcp.png" alt="">
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
@ -27,10 +29,9 @@
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
max-width: 352px;
|
||||
max-height: 352px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 500px;
|
||||
max-height: 500px;
|
||||
height: 99%;
|
||||
object-fit: contain;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
98
.vitepress/theme/components/home/TwoSideLayout.vue
Normal file
98
.vitepress/theme/components/home/TwoSideLayout.vue
Normal file
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div class="two-side-layout">
|
||||
<div :class="['content-container', { 'reverse': imagePlacement === 'left' }]">
|
||||
<div class="text-content">
|
||||
<div v-for="(item, index) in texts" :key="index" class="text-item">
|
||||
<span class="prefix">{{ index + 1 }}.</span> {{ item }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="image-container">
|
||||
<img :src="image" alt="双栏布局图片" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { defineProps } from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
imagePlacement: {
|
||||
type: String,
|
||||
default: 'left',
|
||||
validator: (value) => ['left', 'right'].includes(value)
|
||||
},
|
||||
texts: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
image: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.two-side-layout {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
max-width: 1200px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.content-container.reverse {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.text-content {
|
||||
flex: 1;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.6;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.text-item {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid var(--vp-c-default-3);
|
||||
padding-bottom: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.prefix {
|
||||
color: var(--vp-c-brand-1);
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.image-container {
|
||||
flex: 2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.image-container img {
|
||||
max-width: 100%;
|
||||
object-fit: contain;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.content-container {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.content-container.reverse {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -2,7 +2,8 @@
|
||||
import { h } from 'vue';
|
||||
import type { Theme } from 'vitepress';
|
||||
import DefaultTheme from 'vitepress/theme';
|
||||
import HeroImage from './openmcp-hero-image.vue';
|
||||
import HeroImage from './components/home/HeroImage.vue';
|
||||
import TwoSideLayout from './components/home/TwoSideLayout.vue';
|
||||
|
||||
import './style.css';
|
||||
|
||||
@ -14,6 +15,6 @@ export default {
|
||||
})
|
||||
},
|
||||
enhanceApp({ app, router, siteData }) {
|
||||
// ...
|
||||
app.component('TwoSideLayout', TwoSideLayout);
|
||||
}
|
||||
} satisfies Theme
|
||||
@ -137,3 +137,6 @@
|
||||
--docsearch-primary-color: var(--vp-c-brand-1) !important;
|
||||
}
|
||||
|
||||
.two-side-layout .image-container {
|
||||
display: unset !important;
|
||||
}
|
||||
20
.vscode/vue.code-snippets
vendored
Normal file
20
.vscode/vue.code-snippets
vendored
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
"Vue 3 TypeScript Component": {
|
||||
"prefix": "vue3ts",
|
||||
"body": [
|
||||
"<template>",
|
||||
"\t$1",
|
||||
"</template>",
|
||||
"",
|
||||
"<script setup lang=\"ts\">",
|
||||
"import { defineComponent } from 'vue';",
|
||||
"",
|
||||
"defineComponent({ name: '$TEMPLATE_NAME' });",
|
||||
"</script>",
|
||||
"",
|
||||
"<style>",
|
||||
"</style>"
|
||||
],
|
||||
"description": "Vue 3 TypeScript component template"
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 72 KiB After Width: | Height: | Size: 72 KiB |
BIN
images/openmcp.chatbot.png
Normal file
BIN
images/openmcp.chatbot.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 543 KiB |
BIN
images/openmcp.png
Normal file
BIN
images/openmcp.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
BIN
images/public-deploy.png
Normal file
BIN
images/public-deploy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 431 KiB |
43
index.md
43
index.md
@ -4,26 +4,45 @@ layout: home
|
||||
|
||||
hero:
|
||||
name: "OpenMCP"
|
||||
text: "elegant mcp debuggers and sdk for developers"
|
||||
tagline: Shortening the last mile from LLM to Agent
|
||||
|
||||
text: "面向开发者的优雅 MCP 调试器和 SDK"
|
||||
tagline: 缩短从大语言模型到智能体的最后一公里
|
||||
|
||||
actions:
|
||||
- theme: brand
|
||||
text: OpenMCP Client
|
||||
text: OpenMCP 客户端
|
||||
link: /markdown-examples
|
||||
- theme: alt
|
||||
text: openmcp-sdk
|
||||
link: /api-examples
|
||||
- theme: alt
|
||||
text: Github
|
||||
link: /api-examples
|
||||
text: GitHub
|
||||
link: https://github.com/LSTM-Kirigaya/openmcp-client
|
||||
|
||||
features:
|
||||
- title: Integrated Debugging Environment
|
||||
details: Combines Inspector with MCP client functions for seamless development and testing
|
||||
- title: Comprehensive Project Management
|
||||
details: Offers complete project-level control panels for efficient MCP project oversight
|
||||
- title: Multi-Model Support
|
||||
details: Supports various large language models with flexible integration capabilities
|
||||
- title: 集成调试环境
|
||||
details: 将检查器与 MCP 客户端功能相结合，实现无缝开发和测试
|
||||
- title: 全面的项目管理
|
||||
details: 提供完整的项目级控制面板，实现高效的 MCP 项目监督
|
||||
- title: 多模型支持
|
||||
details: 支持多种大语言模型，具备灵活的集成能力
|
||||
---
|
||||
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
# OpenMCP 为谁准备？
|
||||
|
||||
<a href="https://qm.qq.com/cgi-bin/qm/qr?k=C6ZUTZvfqWoI12lWe7L93cWa1hUsuVT0&jump_from=webapi&authKey=McW6B1ogTPjPDrCyGttS890tMZGQ1KB3QLuG4aqVNRaYp4vlTSgf2c6dMcNjMuBD" target="_blank" style="display: inline-block; padding: 2px 8px; font-size: 0.8rem; background-color: var(--vp-c-brand-3); color: white; border-radius: .5em; text-decoration: none; margin-right: 10px;">开源社区爱好者</a><a href="https://qm.qq.com/cgi-bin/qm/qr?k=C6ZUTZvfqWoI12lWe7L93cWa1hUsuVT0&jump_from=webapi&authKey=McW6B1ogTPjPDrCyGttS890tMZGQ1KB3QLuG4aqVNRaYp4vlTSgf2c6dMcNjMuBD" target="_blank" style="display: inline-block; padding: 2px 8px; font-size: 0.8rem; background-color: var(--vp-button-alt-bg); color: white; border-radius: .5em; text-decoration: none; margin-right: 10px;">专业软件工程师</a><a href="https://qm.qq.com/cgi-bin/qm/qr?k=C6ZUTZvfqWoI12lWe7L93cWa1hUsuVT0&jump_from=webapi&authKey=McW6B1ogTPjPDrCyGttS890tMZGQ1KB3QLuG4aqVNRaYp4vlTSgf2c6dMcNjMuBD" target="_blank" style="display: inline-block; padding: 2px 8px; font-size: 0.8rem; background-color: var(--vp-button-alt-bg); color: white; border-radius: .5em; text-decoration: none; margin-right: 10px;">AI研发科学家</a>
|
||||
|
||||
<TwoSideLayout
|
||||
:texts="[
|
||||
'在编辑器中写完代码直接测试，无需打开第三方软件。提供极其丰富的功能和特性。',
|
||||
'在左侧面板自由而优雅地管理、调试和测试你的智能体。',
|
||||
'大模型调用工具的每一个细节一览无余，不满意的调用结果直接一键复现。',
|
||||
'每一次对话都会显示各项性能指标，方便进行成本管理。',
|
||||
'系统提示词管理面板，让您轻松用 mcp 服务器和系统提示词构建您的智能体应用。',
|
||||
'每一次测试的细节都会 100% 跟随 git 进行版本控制，方便你分享你的每一次试验结果，也方便你零成本复现别人的 mcp 项目。'
|
||||
]"
|
||||
image="/images/openmcp.chatbot.png"
|
||||
/>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user