Runtime API Examples
This page demonstrates usage of some of the runtime APIs provided by VitePress.
The main useData() API can be used to access site, theme, and page data for the current page. It works in both .md and .vue files:
md
<script setup>
import { useData } from 'vitepress'
const { theme, page, frontmatter } = useData()
</script>
## Results
### Theme Data
<pre>{{ theme }}</pre>
### Page Data
<pre>{{ page }}</pre>
### Page Frontmatter
<pre>{{ frontmatter }}</pre>Results
Theme Data
{
"footer": {
"message": "",
"copyright": "Copyright © 2025 主题 <a href=\"https://vitepress.mosong.cc\" target=\"_blank\" style=\"\">VitePress Theme</a>"
},
"vpapi": "https://makegame.store",
"nav": [
{
"text": "课程干货",
"link": "/minigame/introduction/introduction-to-minigames"
},
{
"text": "知识星球",
"link": "https://wx.zsxq.com/group/15555825582152"
}
],
"sidebar": [
{
"text": "第一部分：小游戏和开发工具",
"items": [
{
"text": "第一章：小游戏介绍",
"link": "/minigame/introduction/introduction-to-minigames",
"items": [
{
"text": "概述和历史",
"link": "/minigame/introduction/base/overview-and-history"
},
{
"text": "小游戏平台",
"link": "/minigame/introduction/base/platform-differences"
},
{
"text": "YouTube Playables",
"link": "/minigame/introduction/base/youtube-playables"
},
{
"text": "小游戏如何赚钱",
"link": "/minigame/introduction/base/how-minigames-make-money"
}
]
},
{
"text": "第二章：常见游戏开发工具",
"link": "/minigame/introduction/game-development-tools",
"items": [
{
"text": "低门槛游戏开发工具",
"link": "/minigame/introduction/choosing-the-right-tools/low-barrier-tools"
},
{
"text": "如何选择合适的工具",
"link": "/minigame/introduction/choosing-the-right-tools/choosing-the-right-tools"
}
]
}
]
},
{
"text": "第二部分：小游戏开发基础",
"items": [
{
"text": "第三章：小游戏开发环境搭建",
"link": "/minigame/basics/development-environment-setup",
"items": [
{
"text": "Cocos Creator 安装和配置",
"link": "/minigame/basics/cocos-creator-setup/cocos-creator-installation-and-configuration"
},
{
"text": "小游戏开发环境搭建",
"link": "/minigame/basics/cocos-creator-setup/minigame-development-environment-setup"
}
]
},
{
"text": "第四章：小游戏资源",
"link": "/minigame/basics/resources",
"items": [
{
"text": "游戏素材从哪里来",
"link": "/minigame/basics/resources/where-to-get-game-assets"
}
]
},
{
"text": "第五章：小游戏中的UI设计",
"link": "/minigame/basics/ui-design",
"items": [
{
"text": "小游戏设备适配怎么做？",
"link": "/minigame/basics/ui-design/how-to-do-multi-platform-adaptation-in-cocos-creator"
},
{
"text": "小游戏UI设计原则和方法：易用性",
"link": "/minigame/basics/ui-design/ui-design-principles-and-methods-usability"
}
]
},
{
"text": "第六章：小游戏图形和动画",
"link": "/minigame/basics/graphics-and-animation",
"items": [
{
"text": "如何动态创建精灵",
"link": "/minigame/basics/graphics-and-animation-examples/how-to-dynamically-create-sprites-in-cocos-creator"
},
{
"text": "如何实现转盘动画",
"link": "/minigame/basics/graphics-and-animation-examples/how-to-implement-a-lottery-wheel-animation"
},
{
"text": "如何实现金币奖励动画",
"link": "/minigame/basics/graphics-and-animation-examples/how-to-implement-a-coin-reward-animation"
},
{
"text": "成语小秀才中正确答案的动画效果",
"link": "/minigame/basics/graphics-and-animation-examples/animation-effect-for-correct-answers-in-chengyu-xiaoxiucai"
},
{
"text": "如何创建酷炫的游戏背景",
"link": "/minigame/basics/graphics-and-animation-examples/how-to-create-a-cool-game-background-with-cocos-creator"
},
{
"text": "掌握这3个游戏动画技巧",
"link": "/minigame/basics/graphics-and-animation-examples/mastering-these-3-game-animation-techniques"
},
{
"text": "在 Cocos Creator 中实现落叶动画",
"link": "/minigame/basics/graphics-and-animation-examples/implementing-leaf-animation-in-cocos-creator"
},
{
"text": "小游戏砸金蛋效果",
"link": "/minigame/basics/graphics-and-animation-examples/minigame-golden-egg-smashing-effect"
},
{
"text": "如何实现按钮动画效果",
"link": "/minigame/basics/graphics-and-animation-examples/how-to-implement-button-animation-effects-in-cocos-creator"
},
{
"text": "小游戏中的粒子效果",
"link": "/minigame/basics/graphics-and-animation-examples/particle-effects-in-minigames"
},
{
"text": "成语小秀才中的答题抖动动画效果",
"link": "/minigame/basics/graphics-and-animation-examples/shake-animation-effect-for-incorrect-answers-in-chengyu-xiaoxiucai"
}
]
}
]
},
{
"text": "第三部分：小游戏实战",
"link": "/minigame/practice",
"items": [
{
"text": "第七章：经典案例实战",
"link": "/minigame/practice/classic-case-studies",
"items": [
{
"text": "欢乐水杯源码实战",
"link": "/minigame/practice/make-game/core-implementation-of-happy-water-cup-part-one"
},
{
"text": "拯救狗狗源码实战",
"link": "/minigame/practice/make-game/save-the-dog-easier-than-you-think"
},
{
"text": "完蛋！我被美女包围了！开发详解",
"link": "/minigame/practice/make-game/development-detailed-of-i-am-surrounded-by-beauties"
},
{
"text": "成语小秀才核心玩法实践",
"link": "/minigame/practice/make-game/core-gameplay-practice-of-chengyu-xiaoxiucai"
},
{
"text": "开发电子木鱼小游戏的一些细节",
"link": "/minigame/practice/make-game/some-details-of-developing-the-electronic-wooden-fish-mini-game"
},
{
"text": "如何开发一款赛车合成游戏？",
"link": "/minigame/practice/make-game/how-to-develop-a-racing-synthesis-game"
},
{
"text": "开局托儿所核心逻辑实现和源码",
"link": "/minigame/practice/make-game/core-logic-implementation-and-source-code-of-kindergarten-game"
},
{
"text": "俄罗斯方块1010的开发要点",
"link": "/minigame/practice/make-game/development-key-points-of-tetris-1010"
},
{
"text": "打个螺丝游戏源码解析",
"link": "/minigame/practice/make-game/you-dare-to-learn-i-dare-to-teach-14-steps-to-learn-the-screw-game"
},
{
"text": "泡泡龙游戏实战",
"link": "/minigame/practice/make-game/hand-in-hand-to-implement-bubble-dragon-game"
},
{
"text": "推箱子小游戏实战",
"link": "/minigame/practice/make-game/sokoban-minigame-practice"
},
{
"text": "打螺丝游戏玩法的核心实现",
"link": "/minigame/practice/make-game/core-implementation-of-screw-gameplay"
},
{
"text": "消灭星星源码实战",
"link": "/minigame/practice/make-game/eliminate-stars-implementation-guide"
},
{
"text": "水排序的核心实现",
"link": "/minigame/practice/make-game/core-logic-implementation-of-water-sorting"
},
{
"text": "数字华容道源码实战",
"link": "/minigame/practice/make-game/how-to-develop-a-sliding-puzzle-game"
},
{
"text": "如何开发一个找茬游戏",
"link": "/minigame/practice/make-game/how-to-develop-a-spot-the-difference-game"
},
{
"text": "如何实现花园特工队游戏的背包整理",
"link": "/minigame/practice/make-game/how-to-implement-garden-agent-teams-backpack-organization"
},
{
"text": "合成大西瓜源码实战",
"link": "/minigame/practice/make-game/implementing-watermelon-game-core-gameplay-in-less-than-100-lines-of-code"
},
{
"text": "羊了个羊开源码实战",
"link": "/minigame/practice/make-game/key-points-to-develop-a-sheep-a-sheep-game"
},
{
"text": "植物大战僵尸源码实战",
"link": "/minigame/practice/make-game/how-to-develop-a-plants-vs-zombies-game-practical"
},
{
"text": "超级解压馆源码实战",
"link": "/minigame/practice/make-game/super-relaxation-hall-gameplay-replication"
},
{
"text": "爱上叠叠叠源码实战",
"link": "/minigame/practice/make-game/some-development-details-of-the-love-stacking-mini-game"
},
{
"text": "连连看源码实战",
"link": "/minigame/practice/make-game/how-is-the-game-connected-again-made"
}
]
},
{
"text": "第八章：组件与优化",
"link": "/minigame/practice/components-and-optimization",
"items": [
{
"text": "微信小游戏的好友排行榜功能",
"link": "/minigame/practice/components/wechat-friend-ranking"
},
{
"text": "小游戏优化的一些思路",
"link": "/minigame/practice/components/minigame-optimization-ideas"
}
]
}
]
},
{
"text": "第四部分：小游戏宣传与运营",
"items": [
{
"text": "第九章：小游戏的发布和上线",
"link": "/minigame/marketing/publishing-and-launch",
"items": [
{
"text": "小游戏的版本管理和更新",
"link": "/minigame/marketing/publishing-and-launch/version-management-and-updates"
},
{
"text": "软件著作权证书申请指南",
"link": "/minigame/marketing/publishing-and-launch/software-copyright-certificate-after-47-days"
},
{
"text": "聊聊微信小游戏的上架流程",
"link": "/minigame/marketing/publishing-and-launch/wechat-minigame-publishing-process"
},
{
"text": "抖音小游戏上架指南",
"link": "/minigame/marketing/publishing-and-launch/douyin-minigame-publishing-guide"
},
{
"text": "小游戏的发布流程和注意事项",
"link": "/minigame/marketing/publishing-and-launch/minigame-publishing-process-and-considerations"
}
]
},
{
"text": "第十章：小游戏的数据统计分析",
"link": "/minigame/marketing/data-analytics",
"items": [
{
"text": "游戏的数据一些思考",
"link": "/minigame/marketing/data-analytics/thoughts-on-game-data"
},
{
"text": "小游戏的数据统计和分析工具",
"link": "/minigame/marketing/data-analytics/data-analytics-tools"
}
]
},
{
"text": "第十一章：发行买量",
"link": "/minigame/marketing/user-acquisition",
"items": [
{
"text": "新游如何买量测试",
"link": "/minigame/marketing/user-acquisition/how-to-test-user-acquisition-for-new-games"
}
]
}
]
},
{
"text": "第五部分：总结与思考",
"items": [
{
"text": "第十二章：小游戏立项",
"link": "/minigame/summary/project-initiation",
"items": [
{
"text": "小游戏热点该怎么找",
"link": "/minigame/summary/project-startup/how-to-start-a-casual-minigame-project-from-scratch"
},
{
"text": "爆款小游戏有迹可循",
"link": "/minigame/summary/project-startup/how-to-conduct-competitive-analysis-for-minigames"
},
{
"text": "抖音小游戏立项",
"link": "/minigame/summary/project-startup/douyin-mini-game"
},
{
"text": "微信三消游戏立项",
"link": "/minigame/summary/project-startup/wechat-elimination-game"
},
{
"text": "《沙威玛传奇》启示录",
"link": "/minigame/summary/project-startup/shawarma-legend"
},
{
"text": "连连看新品：《连了又连》",
"link": "/minigame/summary/project-startup/lianliankan"
}
]
},
{
"text": "第十三章：行业思考",
"link": "/minigame/summary/industry-insights",
"items": [
{
"text": "小游戏广告变现设计思路",
"link": "/minigame/summary/industry-thinking/mini-game-advertising-monetization-design-ideas"
},
{
"text": "小游戏是一个理想的副业",
"link": "/minigame/summary/industry-thinking/mini-games-are-an-ideal-side-hustle"
},
{
"text": "小游戏收入翻倍的一些思考",
"link": "/minigame/summary/industry-thinking/reflections-on-doubling-mini-game-revenue"
},
{
"text": "小游戏如何蹭热点搞钱",
"link": "/minigame/summary/industry-thinking/riding-on-the-trend"
},
{
"text": "哪些人适合进入小游戏赛道",
"link": "/minigame/summary/industry-thinking/who-want-to-enter-the-mini-game-track"
}
]
}
]
}
],
"socialLinks": [
{
"icon": "github",
"link": "https://gitee.com/heihei1024"
}
]
}Page Data
{
"title": "Runtime API Examples",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "api-examples.md",
"filePath": "api-examples.md"
}Page Frontmatter
{
"outline": "deep"
}More
Check out the documentation for the full list of runtime APIs.