update
This commit is contained in:
parent
f82454c2dc
commit
62737f00c4
@ -1,4 +1,5 @@
|
||||
import { defineConfig } from 'vitepress';
|
||||
import lightbox from "vitepress-plugin-lightbox";
|
||||
|
||||
export const customIcons = {
|
||||
share: {
|
||||
@ -14,6 +15,12 @@ export default defineConfig({
|
||||
base: baseUrl,
|
||||
ignoreDeadLinks: true,
|
||||
|
||||
markdown: {
|
||||
config: (md) => {
|
||||
md.use(lightbox, {});
|
||||
}
|
||||
},
|
||||
|
||||
head: [
|
||||
['link', { rel: 'icon', href: baseUrl + '/images/favicon.png' }]
|
||||
],
|
||||
|
||||
@ -1,15 +1,30 @@
|
||||
|
||||
|
||||
<template>
|
||||
<DefaultTheme.Layout id="k-layout" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useData } from 'vitepress'
|
||||
import DefaultTheme from 'vitepress/theme'
|
||||
import { nextTick, provide } from 'vue'
|
||||
import { useData, useRouter } from 'vitepress';
|
||||
import DefaultTheme from 'vitepress/theme';
|
||||
import { nextTick, onMounted, provide } from 'vue';
|
||||
import mediumZoom from "medium-zoom";
|
||||
import { animateIn, animateOut } from './hook/animate';
|
||||
|
||||
const data = useData()
|
||||
const router = useRouter()
|
||||
const enableTransitions = () =>
|
||||
'startViewTransition' in document &&
|
||||
window.matchMedia('(prefers-reduced-motion: no-preference)').matches
|
||||
window.matchMedia('(prefers-reduced-motion: no-preference)').matches;
|
||||
|
||||
const isDark = data.isDark;
|
||||
|
||||
const setupMediumZoom = () => {
|
||||
mediumZoom("[data-zoomable]", {
|
||||
background: "transparent",
|
||||
});
|
||||
};
|
||||
|
||||
// 移除原有的 transition 相关逻辑
|
||||
provide('toggle-appearance', async () => {
|
||||
if (!enableTransitions()) {
|
||||
@ -28,16 +43,76 @@ provide('toggle-appearance', async () => {
|
||||
pseudoElement: `::view-transition-${isDark.value ? 'old' : 'new'}(root)`
|
||||
}
|
||||
)
|
||||
})
|
||||
</script>
|
||||
});
|
||||
|
||||
<template>
|
||||
<DefaultTheme.Layout />
|
||||
</template>
|
||||
const sameSource = (from: string, to: string) => {
|
||||
return from.split('/').slice(0, 3).join('/') === to.split('/').slice(0, 3).join('/');
|
||||
}
|
||||
|
||||
const handleRouteChangeStart = async (to: string) => {
|
||||
const from = router.route.path;
|
||||
|
||||
if (sameSource(from, to)) {
|
||||
await animateIn('VPContent', { name: 'fade' });
|
||||
} else {
|
||||
await animateIn('k-layout', { name: 'fade' });
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const handleRouteChangeComplete = async (to: string) => {
|
||||
await animateOut({ name: 'fade' });
|
||||
setupMediumZoom();
|
||||
};
|
||||
|
||||
|
||||
router.onBeforeRouteChange = handleRouteChangeStart;
|
||||
router.onAfterRouteChange = handleRouteChangeComplete;
|
||||
|
||||
onMounted(() => {
|
||||
setupMediumZoom();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 添加全局过渡效果 */
|
||||
:root {
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
transition: background-color 0.15s ease, color 0.3s ease;
|
||||
}
|
||||
|
||||
.medium-zoom-overlay {
|
||||
backdrop-filter: blur(5rem);
|
||||
}
|
||||
|
||||
.medium-zoom-overlay,
|
||||
.medium-zoom-image--opened {
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
/* 淡入淡出动画 */
|
||||
.fade-in {
|
||||
opacity: 1;
|
||||
transition: opacity 0.15s ease-out;
|
||||
}
|
||||
|
||||
.fade-out {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 过渡状态 */
|
||||
.fade-in-out.transitioning {
|
||||
pointer-events: none;
|
||||
/* 过渡期间禁用交互 */
|
||||
}
|
||||
|
||||
/* 自定义淡入淡出动画 */
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.15s ease;
|
||||
}
|
||||
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
</style>
|
||||
43
.vitepress/theme/hook/animate.ts
Normal file
43
.vitepress/theme/hook/animate.ts
Normal file
@ -0,0 +1,43 @@
|
||||
|
||||
export interface AnimationOption {
|
||||
durationMs?: number;
|
||||
name?: 'fade' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right';
|
||||
easing?: 'ease' | 'linear' | 'ease-in' | 'ease-out' | 'ease-in-out';
|
||||
}
|
||||
|
||||
function sleep(time: number) {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(resolve, time);
|
||||
});
|
||||
}
|
||||
|
||||
let lastAnimationId = '';
|
||||
|
||||
export async function animateIn(id: string, animationOption?: AnimationOption) {
|
||||
const element = document.getElementById(id);
|
||||
if (!element) {
|
||||
return;
|
||||
}
|
||||
|
||||
lastAnimationId = id;
|
||||
|
||||
const { durationMs = 150, name = 'fade', easing = 'ease-out' } = animationOption || {};
|
||||
element.style.transition = `opacity ${durationMs / 1000}s ${easing}`;
|
||||
|
||||
element.classList.remove(name + '-in');
|
||||
element.classList.add(name + '-out');
|
||||
await sleep(durationMs);
|
||||
}
|
||||
|
||||
export async function animateOut(animationOption?: AnimationOption) {
|
||||
const element = document.getElementById(lastAnimationId);
|
||||
if (!element) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { durationMs = 150, name = 'fade', easing = 'ease-out' } = animationOption || {};
|
||||
element.style.transition = `opacity ${durationMs / 1000}s ${easing}`;
|
||||
|
||||
element.classList.remove(name + '-out');
|
||||
element.classList.add(name + '-in');
|
||||
}
|
||||
2
index.md
2
index.md
@ -98,7 +98,7 @@ features:
|
||||
正如它的名字一样，OpenMCP 是一个面向开发者的 MCP 调试器和 SDK，致力于降低 AI Agent 的全链路开发成本和开发人员的心智负担。通过 OpenMCP 制作出可以在真实生活场景中解决问题，缩短工作时间的 mcp 工具，或是让工程师与研发科学家更快地交付 demo，并将这份愿景让公众看到，是我们的任务和使命。
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="OpenMCP 是免费的吗？" name="2">
|
||||
是的，OpenMCP 完全开源，您不仅可以免费试用此产品，也可以一起加入我们，实现你的关于 Agent 的奇思妙想。OpenMCP 的任务是建立起关于 MCP 的生态圈。因为我们认为，MCP 的开发在未来一段时间内会是一项高度定制化的工作，所以当前的重点并不是赶紧出做一个看起来什么都能做的 Agent，而是步步为营做出相关的生态和基础设施。
|
||||
是的，OpenMCP 完全开源，您不仅可以免费使用此产品，也可以一起加入我们，实现你的关于 Agent 的奇思妙想。OpenMCP 的任务是建立起关于 MCP 的生态圈。因为我们认为，MCP 的开发在未来一段时间内会是一项高度定制化的工作，所以当前的重点并不是赶紧出做一个看起来什么都能做的 Agent，而是步步为营做出相关的生态和基础设施。
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="OpenMCP 不适合做什么？" name="3">
|
||||
如果你试图通过 OpenMCP 开发一款什么都能做的，通用的 AI Agent，你应该做的是把钱全部投资到量子计算机的研发，而不是点开这个网站。记住一句话，这个时代做全领域通用AI Agent，依概率收敛到电信诈骗。
|
||||
|
||||
31
package-lock.json
generated
31
package-lock.json
generated
@ -7,6 +7,9 @@
|
||||
"dependencies": {
|
||||
"element-plus": "^2.9.11",
|
||||
"vitepress": "^1.6.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"vitepress-plugin-lightbox": "^1.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@algolia/autocomplete-core": {
|
||||
@ -1771,6 +1774,13 @@
|
||||
"url": "https://opencollective.com/unified"
|
||||
}
|
||||
},
|
||||
"node_modules/medium-zoom": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/medium-zoom/-/medium-zoom-1.1.0.tgz",
|
||||
"integrity": "sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/memoize-one": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz",
|
||||
@ -1909,6 +1919,16 @@
|
||||
"resolved": "https://registry.npmmirror.com/perfect-debounce/-/perfect-debounce-1.0.0.tgz",
|
||||
"integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="
|
||||
},
|
||||
"node_modules/photoswipe": {
|
||||
"version": "5.4.4",
|
||||
"resolved": "https://registry.npmjs.org/photoswipe/-/photoswipe-5.4.4.tgz",
|
||||
"integrity": "sha512-WNFHoKrkZNnvFFhbHL93WDkW3ifwVOXSW3w1UuZZelSmgXpIGiZSNlZJq37rR8YejqME2rHs9EhH9ZvlvFH2NA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/picocolors": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.1.1.tgz",
|
||||
@ -2294,6 +2314,17 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/vitepress-plugin-lightbox": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/vitepress-plugin-lightbox/-/vitepress-plugin-lightbox-1.0.2.tgz",
|
||||
"integrity": "sha512-CLgz6iWzhTH/Buk0y/SPRy0Ukh+X9QPD1HMAlpVcBPPpENlKwtxKUrAzqwxgh/vOz+6Q+Kw5nKfPH1yL78Rlag==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"medium-zoom": "^1.1.0",
|
||||
"photoswipe": "^5.4.4"
|
||||
}
|
||||
},
|
||||
"node_modules/vue": {
|
||||
"version": "3.5.14",
|
||||
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.14.tgz",
|
||||
|
||||
@ -8,5 +8,8 @@
|
||||
"dependencies": {
|
||||
"element-plus": "^2.9.11",
|
||||
"vitepress": "^1.6.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"vitepress-plugin-lightbox": "^1.0.2"
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
# 连接 mcp 服务器
|
||||
|
||||
不同于 Claude Desktop 和其他的 MCP 客户端类产品，OpenMCP 进行 MCP 服务器连接的步骤是相当丝滑的。
|
||||
|
||||
:::info MCP客户端
|
||||
MCP 客户端是指能够通过 MCP 协议进行通信的大模型对话客户端，通常是一个运行在本地的应用程序（因为网页没有文件IO的权限）。它的产品形式目前几乎都是聊天机器人的形式，类似于你在网页使用的 chat.deepseek.com 或者 chat.openai.com
|
||||
:::
|
||||
|
||||
首先，打开你的 VLE，在 [获取 OpenMCP](https://kirigaya.cn/openmcp/plugin-tutorial/acquire-openmcp.html) 中完成 OpenMCP 的安装后，
|
||||
Loading…
x
Reference in New Issue
Block a user