Runtime API Examples
更新: 9/4/2025字数: 0 字 时长: 0 分钟
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
{
"logo": "/avatar.png",
"nav": [
{
"text": "主页",
"link": "/column/Personal/index.md"
},
{
"text": "AI 提效",
"link": "/column/AIFuture/index.md"
},
{
"text": "React",
"link": "/column/React/index.md"
},
{
"text": "Vue",
"link": "/column/Vue/index.md"
},
{
"text": "Next.js",
"link": "/column/Next/index.md"
},
{
"text": "网络相关",
"link": "/column/Network/index.md"
},
{
"text": "后端相关",
"items": [
{
"text": "Node.js",
"link": "/column/Node/index.md"
},
{
"text": "Python",
"link": "/column/Python/index.md"
},
{
"text": "数据库",
"link": "/column/数据库/index.md"
}
]
},
{
"text": "服务与部署",
"items": [
{
"text": "Nginx常用",
"link": "/column/Nginx/index.md"
},
{
"text": "Docker常用",
"link": "/column/Docker/index.md"
},
{
"text": "Linux常用",
"link": "/column/Linux/index.md"
},
{
"text": "阿里云ECS",
"link": "/column/Aliyun/index.md"
}
]
},
{
"text": "更多",
"items": [
{
"text": "进阶",
"items": [
{
"text": "Angular",
"link": "/column/Angular/index.md"
},
{
"text": "JS进阶",
"link": "/column/JS/index.md"
},
{
"text": "TS进阶",
"link": "/column/TS/index.md"
},
{
"text": "Git常用",
"link": "/column/Git/index.md"
},
{
"text": "前端进阶",
"link": "/column/前端进阶/index.md"
}
]
},
{
"text": "前端生态",
"items": [
{
"text": "框架组件",
"link": "/column/Ecology/com.md"
},
{
"text": "工程化相关",
"link": "/column/Ecology/project.md"
},
{
"text": "工具推荐",
"link": "/column/Recommend/index.md"
},
{
"text": "常见面试题",
"link": "/column/Interview/index.md"
}
]
},
{
"text": "日常记录",
"items": [
{
"text": "踩坑记录",
"link": "/column/ProblemNotes/踩坑记录/"
},
{
"text": "组件封装与文件处理",
"link": "/column/ProblemNotes/组件封装与文件处理/"
},
{
"text": "小程序相关",
"link": "/column/ProblemNotes/miniProgram/"
},
{
"text": "HTML/CSS",
"link": "/column/ProblemNotes/HtmlCss/index.md"
}
]
}
]
},
{
"text": "其它",
"items": [
{
"text": "更新记录",
"link": "/column/UpdateLog/changelog.md"
},
{
"text": "样式测试",
"link": "/column/StyleText/index.md"
},
{
"text": "诗词相关",
"link": "/column/Poetry/index.md"
},
{
"text": "生活常识",
"link": "/column/CommonSense/index.md"
}
]
}
],
"sidebar": {
"/column/JS/": [
{
"text": "核心机制",
"items": [
{
"text": "语言基础",
"items": [
{
"text": "标准JS和浏览器JS的区别",
"link": "/column/JS/核心机制/语言基础/标准JS和浏览器JS的区别.md"
},
{
"text": "typeof与instanceof区别",
"link": "/column/JS/核心机制/语言基础/typeof与instanceof区别.md"
},
{
"text": "匿名函数和箭头函数",
"link": "/column/JS/核心机制/语言基础/匿名函数和箭头函数.md"
},
{
"text": "双重否定与空值合并运算符",
"link": "/column/JS/核心机制/语言基础/双重否定与空值合并运算符.md"
},
{
"text": "展开运算符的使用",
"link": "/column/JS/核心机制/语言基础/展开运算符的使用.md"
},
{
"text": "类型转换",
"link": "/column/JS/核心机制/语言基础/类型转换.md"
},
{
"text": "Error精细化处理",
"link": "/column/JS/核心机制/语言基础/Error精细化处理.md"
},
{
"text": "ES6Module模块化跨域问题",
"link": "/column/JS/核心机制/语言基础/ES6Module模块化跨域问题.md"
},
{
"text": "console多种打印方式",
"link": "/column/JS/核心机制/语言基础/console多种打印方式.md"
}
]
},
{
"text": "面向对象",
"items": [
{
"text": "原型和原型链",
"link": "/column/JS/核心机制/面向对象/原型和原型链.md"
},
{
"text": "this指向问题",
"link": "/column/JS/核心机制/面向对象/this指向问题.md"
},
{
"text": "Proxy与Reflect",
"link": "/column/JS/核心机制/面向对象/Proxy与Reflect.md"
}
]
},
{
"text": "异步编程",
"items": [
{
"text": "promise讲解",
"link": "/column/JS/核心机制/异步编程/promise讲解.md"
},
{
"text": "promise.all和race进阶",
"link": "/column/JS/核心机制/异步编程/promise.all和race进阶.md"
},
{
"text": "promise静态方法详解",
"link": "/column/JS/核心机制/异步编程/promise静态方法详解.md"
},
{
"text": "generator和async讲解",
"link": "/column/JS/核心机制/异步编程/generator和async讲解.md"
},
{
"text": "AbortController请求中断",
"link": "/column/JS/核心机制/异步编程/AbortController请求中断.md"
},
{
"text": "requestAnimationFrame",
"link": "/column/JS/核心机制/异步编程/requestAnimationFrame.md"
},
{
"text": "IntersectionObserver",
"link": "/column/JS/核心机制/异步编程/IntersectionObserver.md"
},
{
"text": "IntersectionObserver实现高效懒加载",
"link": "/column/JS/核心机制/异步编程/IntersectionObserver实现高效懒加载.md"
}
]
},
{
"text": "JS异步机制与Event Loop解析",
"link": "/column/JS/核心机制/JS异步机制与Event Loop解析.md"
}
]
},
{
"text": "数据处理",
"items": [
{
"text": "数组处理",
"items": [
{
"text": "常用的浅拷贝和深拷贝",
"link": "/column/JS/数据处理/数组处理/常用的浅拷贝和深拷贝.md"
},
{
"text": "forEach进阶",
"link": "/column/JS/数据处理/数组处理/forEach进阶.md"
},
{
"text": "sort使用场景",
"link": "/column/JS/数据处理/数组处理/sort使用场景.md"
},
{
"text": "高阶函数reduce",
"link": "/column/JS/数据处理/数组处理/高阶函数reduce.md"
},
{
"text": "数组新增常用方法",
"link": "/column/JS/数据处理/数组处理/数组新增常用方法.md"
},
{
"text": "for in和for of循环的区别",
"link": "/column/JS/数据处理/数组处理/for in和for of循环的区别.md"
},
{
"text": "Iterator迭代器和for of循环",
"link": "/column/JS/数据处理/数组处理/Iterator迭代器和for of循环.md"
}
]
},
{
"text": "字符串处理",
"items": [
{
"text": "split和join区别",
"link": "/column/JS/数据处理/字符串处理/split和join区别.md"
},
{
"text": "字符串新增常用方法",
"link": "/column/JS/数据处理/字符串处理/字符串新增常用方法.md"
},
{
"text": "toLocaleString常用场景",
"link": "/column/JS/数据处理/字符串处理/toLocaleString常用场景.md"
}
]
},
{
"text": "对象处理",
"items": [
{
"text": "对象、数组和字符串方法总结",
"link": "/column/JS/数据处理/对象处理/对象、数组和字符串方法总结.md"
},
{
"text": "对象新增的一些常用方法",
"link": "/column/JS/数据处理/对象处理/对象新增的一些常用方法.md"
},
{
"text": "URLSearchParams获取参数",
"link": "/column/JS/数据处理/对象处理/URLSearchParams获取参数.md"
}
]
},
{
"text": "JavaScript常用函数与算法精粹",
"link": "/column/JS/数据处理/JavaScript常用函数与算法精粹.md"
}
]
},
{
"text": "浏览器与DOM",
"items": [
{
"text": "事件冒泡和事件委托",
"link": "/column/JS/浏览器与DOM/事件冒泡和事件委托.md"
},
{
"text": "关于BOM浏览器对象模型",
"link": "/column/JS/浏览器与DOM/关于BOM浏览器对象模型.md"
},
{
"text": "getBoundingClientRect使用",
"link": "/column/JS/浏览器与DOM/getBoundingClientRect使用.md"
},
{
"text": "offset、client、scroll区别",
"link": "/column/JS/浏览器与DOM/offset、client、scroll区别.md"
},
{
"text": "重排和重绘的区别",
"link": "/column/JS/浏览器与DOM/重排和重绘的区别.md"
}
]
}
],
"/column/Vue/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "Vue2核心响应式与渲染原理拆解",
"link": "/column/Vue/基础/Vue2核心响应式与渲染原理拆解.md"
},
{
"text": "Vue3核心响应式与渲染原理拆解",
"link": "/column/Vue/基础/Vue3核心响应式与渲染原理拆解.md"
},
{
"text": "生命周期",
"link": "/column/Vue/基础/生命周期.md"
},
{
"text": "计算属性",
"link": "/column/Vue/基础/计算属性.md"
},
{
"text": "计算属性原理拆解",
"link": "/column/Vue/基础/计算属性原理拆解.md"
},
{
"text": "类与样式绑定",
"link": "/column/Vue/基础/类与样式绑定.md"
},
{
"text": "列表渲染",
"link": "/column/Vue/基础/列表渲染.md"
},
{
"text": "动态组件",
"link": "/column/Vue/基础/动态组件.md"
},
{
"text": "Watch监听",
"link": "/column/Vue/基础/Watch监听.md"
},
{
"text": "Slots插槽",
"link": "/column/Vue/基础/Slots插槽.md"
},
{
"text": "defineExpose",
"link": "/column/Vue/基础/defineExpose.md"
},
{
"text": "Attributes属性透传",
"link": "/column/Vue/基础/Attributes属性透传.md"
},
{
"text": "Mixin混入(不推荐)",
"link": "/column/Vue/基础/Mixin混入(不推荐).md"
},
{
"text": "组件注册和组件通信",
"link": "/column/Vue/基础/组件注册和组件通信.md"
},
{
"text": "路由传参的三种方式",
"link": "/column/Vue/基础/路由传参的三种方式.md"
},
{
"text": "常见的移动端rem适配方案",
"link": "/column/Vue/基础/常见的移动端rem适配方案.md"
},
{
"text": "优雅的vue2项目总体结构",
"link": "/column/Vue/基础/优雅的vue2项目总体结构.md"
}
]
},
{
"text": "深入组件",
"collapsed": false,
"items": [
{
"text": "reactive和ref区别",
"link": "/column/Vue/深入组件/reactive和ref区别.md"
},
{
"text": "vue是mvvm模型吗",
"link": "/column/Vue/深入组件/vue是mvvm模型吗.md"
},
{
"text": "scoped属性原理",
"link": "/column/Vue/深入组件/scoped属性原理.md"
},
{
"text": "依赖注入provide-inject",
"link": "/column/Vue/深入组件/依赖注入provide-inject.md"
},
{
"text": "依赖注入provide-inject实现原理",
"link": "/column/Vue/深入组件/依赖注入provide-inject实现原理.md"
},
{
"text": "异步组件",
"link": "/column/Vue/深入组件/异步组件.md"
},
{
"text": "异步组件实现原理",
"link": "/column/Vue/深入组件/异步组件实现原理.md"
},
{
"text": "路由匹配和懒加载",
"link": "/column/Vue/深入组件/路由匹配和懒加载.md"
}
]
},
{
"text": "内置组件",
"collapsed": false,
"items": [
{
"text": "Teleport",
"link": "/column/Vue/内置组件/Teleport.md"
},
{
"text": "Teleport原理讲解",
"link": "/column/Vue/内置组件/Teleport原理讲解.md"
},
{
"text": "Transition",
"link": "/column/Vue/内置组件/Transition.md"
},
{
"text": "KeepAlive",
"link": "/column/Vue/内置组件/KeepAlive.md"
},
{
"text": "KeepAlive原理讲解",
"link": "/column/Vue/内置组件/KeepAlive原理讲解.md"
},
{
"text": "Suspense",
"link": "/column/Vue/内置组件/Suspense.md"
},
{
"text": "Suspense原理讲解",
"link": "/column/Vue/内置组件/Suspense原理讲解.md"
}
]
},
{
"text": "响应式API进阶",
"collapsed": false,
"items": [
{
"text": "toRefs",
"link": "/column/Vue/响应式API进阶/toRefs.md"
},
{
"text": "readonly",
"link": "/column/Vue/响应式API进阶/readonly.md"
},
{
"text": "toRaw",
"link": "/column/Vue/响应式API进阶/toRaw.md"
},
{
"text": "markRaw",
"link": "/column/Vue/响应式API进阶/markRaw.md"
},
{
"text": "shallowRef",
"link": "/column/Vue/响应式API进阶/shallowRef.md"
},
{
"text": "shallowReactive",
"link": "/column/Vue/响应式API进阶/shallowReactive.md"
},
{
"text": "shallowReadonly",
"link": "/column/Vue/响应式API进阶/shallowReadonly.md"
},
{
"text": "watchEffect",
"link": "/column/Vue/响应式API进阶/watchEffect.md"
},
{
"text": "watchPostEffect",
"link": "/column/Vue/响应式API进阶/watchPostEffect.md"
},
{
"text": "watchSyncEffect",
"link": "/column/Vue/响应式API进阶/watchSyncEffect.md"
},
{
"text": "useId",
"link": "/column/Vue/响应式API进阶/useId.md"
},
{
"text": "reactive视图未更新",
"link": "/column/Vue/响应式API进阶/reactive视图未更新.md"
}
]
},
{
"text": "构建打包相关",
"collapsed": false,
"items": [
{
"text": "publicPath讲解",
"link": "/column/Vue/构建打包相关/publicPath讲解.md"
},
{
"text": "环境变量和NODE_ENV",
"link": "/column/Vue/构建打包相关/环境变量和NODE_ENV.md"
},
{
"text": "vue.config.js",
"link": "/column/Vue/构建打包相关/vue.config.js.md"
},
{
"text": "index.html中获取环境",
"link": "/column/Vue/构建打包相关/index.html中获取环境.md"
},
{
"text": "webpack的基本使用和总结",
"link": "/column/Vue/构建打包相关/webpack的基本使用和总结.md"
},
{
"text": "常见的性能优化",
"link": "/column/Vue/构建打包相关/常见的性能优化.md"
}
]
},
{
"text": "Vite相关",
"collapsed": false,
"items": [
{
"text": "依赖预构建",
"link": "/column/Vue/Vite相关/依赖预构建.md"
},
{
"text": "常用优化插件",
"link": "/column/Vue/Vite相关/常用优化插件.md"
},
{
"text": "使用Eslint",
"link": "/column/Vue/Vite相关/使用Eslint.md"
}
]
},
{
"text": "第三方库使用",
"collapsed": false,
"items": [
{
"text": "VueX详解",
"link": "/column/Vue/第三方库使用/VueX详解.md"
},
{
"text": "VueUse工具集",
"link": "/column/Vue/第三方库使用/VueUse工具集.md"
},
{
"text": "I18n国际化",
"link": "/column/Vue/第三方库使用/I18n国际化.md"
},
{
"text": "Pinia状态管理",
"link": "/column/Vue/第三方库使用/Pinia状态管理.md"
},
{
"text": "Echarts绘制地图",
"link": "/column/Vue/第三方库使用/Echarts绘制地图.md"
},
{
"text": "打包可视化分析",
"link": "/column/Vue/第三方库使用/打包可视化分析.md"
},
{
"text": "VueRouter路由导航",
"link": "/column/Vue/第三方库使用/VueRouter路由导航.md"
},
{
"text": "clipboardjs复制文本",
"link": "/column/Vue/第三方库使用/clipboardjs复制文本.md"
},
{
"text": "BOS百度对象存储",
"link": "/column/Vue/第三方库使用/BOS百度对象存储.md"
},
{
"text": "Canvas图片合并",
"link": "/column/Vue/第三方库使用/Canvas图片合并.md"
},
{
"text": "图片添加水印和截图",
"link": "/column/Vue/第三方库使用/图片添加水印和截图.md"
},
{
"text": "腾讯地图使用",
"link": "/column/Vue/第三方库使用/腾讯地图使用.md"
}
]
}
],
"/column/React/": [
{
"text": "组件",
"collapsed": false,
"items": [
{
"text": "Fiber架构",
"link": "/column/React/组件/Fiber架构.md"
},
{
"text": "认识组件",
"link": "/column/React/组件/认识组件.md"
},
{
"text": "组件通信",
"link": "/column/React/组件/组件通信.md"
},
{
"text": "受控组件",
"link": "/column/React/组件/受控组件.md"
},
{
"text": "传送组件",
"link": "/column/React/组件/传送组件.md"
},
{
"text": "异步组件",
"link": "/column/React/组件/异步组件.md"
},
{
"text": "严格模式",
"link": "/column/React/组件/严格模式.md"
},
{
"text": "AntDesign项目集成阿里Iconfont图标库",
"link": "/column/React/组件/AntDesign项目集成阿里Iconfont图标库.md"
}
]
},
{
"text": "CSS方案",
"collapsed": false,
"items": [
{
"text": "css modules",
"link": "/column/React/CSS方案/css modules.md"
},
{
"text": "css 原子化",
"link": "/column/React/CSS方案/css 原子化.md"
},
{
"text": "css in js(不推荐)",
"link": "/column/React/CSS方案/css in js(不推荐).md"
}
]
},
{
"text": "Hooks",
"collapsed": false,
"items": [
{
"text": "useState",
"link": "/column/React/Hooks/useState.md"
},
{
"text": "useState更新机制",
"link": "/column/React/Hooks/useState更新机制.md"
},
{
"text": "useReducer",
"link": "/column/React/Hooks/useReducer.md"
},
{
"text": "useSyncExternalStore",
"link": "/column/React/Hooks/useSyncExternalStore.md"
},
{
"text": "useTransition",
"link": "/column/React/Hooks/useTransition.md"
},
{
"text": "useDeferredValue",
"link": "/column/React/Hooks/useDeferredValue.md"
},
{
"text": "Hooks为什么不能写到判断里面",
"link": "/column/React/Hooks/Hooks为什么不能写到判断里面.md"
},
{
"text": "自定义Hooks的封装",
"link": "/column/React/Hooks/自定义Hooks的封装.md"
}
]
},
{
"text": "副作用",
"collapsed": false,
"items": [
{
"text": "useEffect",
"link": "/column/React/副作用/useEffect.md"
},
{
"text": "利用useEffect处理竟态操作",
"link": "/column/React/副作用/利用useEffect处理竟态操作.md"
},
{
"text": "useLayoutEffect",
"link": "/column/React/副作用/useLayoutEffect.md"
},
{
"text": "useInsertionEffect",
"link": "/column/React/副作用/useInsertionEffect.md"
}
]
},
{
"text": "状态传递",
"collapsed": false,
"items": [
{
"text": "useRef",
"link": "/column/React/状态传递/useRef.md"
},
{
"text": "useImperativeHandle",
"link": "/column/React/状态传递/useImperativeHandle.md"
},
{
"text": "createContext与useContext",
"link": "/column/React/状态传递/createContext与useContext.md"
},
{
"text": "函数式组件中使用Redux",
"link": "/column/React/状态传递/函数式组件中使用Redux.md"
}
]
},
{
"text": "性能优化",
"collapsed": false,
"items": [
{
"text": "父组件变化导致子组件重新渲染",
"link": "/column/React/性能优化/父组件变化导致子组件重新渲染.md"
},
{
"text": "useMemo和React.memo",
"link": "/column/React/性能优化/useMemo和React.memo.md"
},
{
"text": "useCallback",
"link": "/column/React/性能优化/useCallback.md"
},
{
"text": "使用函数引用作为依赖项",
"link": "/column/React/性能优化/使用函数引用作为依赖项.md"
}
]
},
{
"text": "Zustand",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/React/Zustand/基本使用.md"
},
{
"text": "Immer和持久化",
"link": "/column/React/Zustand/Immer和持久化.md"
},
{
"text": "Immer库使用",
"link": "/column/React/Zustand/Immer库使用.md"
},
{
"text": "状态简化",
"link": "/column/React/Zustand/状态简化.md"
},
{
"text": "状态订阅",
"link": "/column/React/Zustand/状态订阅.md"
}
]
}
],
"/column/Node/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "npm package.json 解析",
"link": "/column/Node/基础/npm package.json 解析.md"
},
{
"text": "npm install 原理",
"link": "/column/Node/基础/npm install 原理.md"
},
{
"text": "npm run 原理",
"link": "/column/Node/基础/npm run 原理.md"
},
{
"text": "npx 命令使用",
"link": "/column/Node/基础/npx 命令使用.md"
},
{
"text": "pnpm 解决幽灵依赖",
"link": "/column/Node/基础/pnpm 解决幽灵依赖.md"
},
{
"text": "pnpm 原理(内容寻址 + 硬链接)",
"link": "/column/Node/基础/pnpm 原理(内容寻址 + 硬链接).md"
},
{
"text": "npm-yarn-pnpm 对比",
"link": "/column/Node/基础/npm-yarn-pnpm 对比.md"
},
{
"text": "node 全局变量",
"link": "/column/Node/基础/node 全局变量.md"
},
{
"text": "模块化规范",
"link": "/column/Node/基础/模块化规范.md"
},
{
"text": "模块查找规则",
"link": "/column/Node/基础/模块查找规则.md"
},
{
"text": "nvm 管理 node 版本",
"link": "/column/Node/基础/nvm 管理 node 版本.md"
},
{
"text": "fnm 管理 node 版本",
"link": "/column/Node/基础/fnm 管理 node 版本.md"
},
{
"text": "npm serve 插件",
"link": "/column/Node/基础/npm serve 插件.md"
}
]
},
{
"text": "内置模块",
"collapsed": false,
"items": [
{
"text": "path 模块",
"link": "/column/Node/内置模块/path 模块.md"
},
{
"text": "fs 与 os 模块",
"link": "/column/Node/内置模块/fs 与 os 模块.md"
},
{
"text": "process 模块",
"link": "/column/Node/内置模块/process 模块.md"
},
{
"text": "events 模块",
"link": "/column/Node/内置模块/events 模块.md"
},
{
"text": "http 模块",
"link": "/column/Node/内置模块/http 模块.md"
},
{
"text": "crypto 模块",
"link": "/column/Node/内置模块/crypto 模块.md"
}
]
},
{
"text": "Web 框架",
"collapsed": false,
"items": [
{
"text": "express 基础入门",
"link": "/column/Node/Web 框架/express 基础入门.md"
},
{
"text": "express 进阶实战",
"link": "/column/Node/Web 框架/express 进阶实战.md"
},
{
"text": "koa 基础入门",
"link": "/column/Node/Web 框架/koa 基础入门.md"
}
]
}
],
"/column/Next/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "了解Nextjs的哲学思想",
"link": "/column/Next/基础/了解Nextjs的哲学思想.md"
},
{
"text": "了解CSR、SSR、SSG",
"link": "/column/Next/基础/了解CSR、SSR、SSG.md"
},
{
"text": "SSR 服务端渲染的原理",
"link": "/column/Next/基础/SSR 服务端渲染的原理.md"
},
{
"text": "什么是 RSC 渲染组件",
"link": "/column/Next/基础/什么是 RSC 渲染组件.md"
},
{
"text": "SSR渲染和RSC组件的区别",
"link": "/column/Next/基础/SSR渲染和RSC组件的区别.md"
},
{
"text": "服务端和客户端组件",
"link": "/column/Next/基础/服务端和客户端组件.md"
},
{
"text": "路由系统",
"items": [
{
"text": "Pages Router和App Router",
"link": "/column/Next/基础/路由系统/Pages Router和App Router.md"
},
{
"text": "客户端页面路由",
"link": "/column/Next/基础/路由系统/客户端页面路由.md"
},
{
"text": "平行路由",
"link": "/column/Next/基础/路由系统/平行路由.md"
},
{
"text": "路由组",
"link": "/column/Next/基础/路由系统/路由组.md"
},
{
"text": "服务端API路由",
"link": "/column/Next/基础/路由系统/服务端API路由.md"
}
]
},
{
"text": "layout页面布局",
"link": "/column/Next/基础/layout页面布局.md"
},
{
"text": "自定义Document",
"link": "/column/Next/基础/自定义Document.md"
},
{
"text": "自定义错误页面",
"link": "/column/Next/基础/自定义错误页面.md"
},
{
"text": "Script组件",
"link": "/column/Next/基础/Script组件.md"
}
]
},
{
"text": "进阶",
"collapsed": false,
"items": [
{
"text": "图像优化",
"link": "/column/Next/进阶/图像优化.md"
},
{
"text": "集成aiSDK",
"link": "/column/Next/进阶/集成aiSDK.md"
},
{
"text": "middleware中间件",
"link": "/column/Next/进阶/middleware中间件.md"
},
{
"text": "Turbopack构建工具",
"link": "/column/Next/进阶/Turbopack构建工具.md"
},
{
"text": "NextRequest和NextResponse",
"link": "/column/Next/进阶/NextRequest和NextResponse.md"
},
{
"text": "常见鉴权方案",
"link": "/column/Next/进阶/常见鉴权方案.md"
},
{
"text": "NextAuth认证",
"link": "/column/Next/进阶/NextAuth认证.md"
},
{
"text": "NextAuth认证常见问题",
"link": "/column/Next/进阶/NextAuth认证常见问题.md"
},
{
"text": "Nextjs打包为什么比较大",
"link": "/column/Next/进阶/Nextjs打包为什么比较大.md"
},
{
"text": "Next.js的standalone构建原理和作用",
"link": "/column/Next/进阶/Next.js的standalone构建原理和作用.md"
}
]
}
],
"/column/Python/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "基础语法入门",
"link": "/column/Python/基础/基础语法入门.md"
},
{
"text": "pip 与虚拟环境管理",
"link": "/column/Python/基础/pip 与虚拟环境管理.md"
},
{
"text": "env 环境变量管理",
"link": "/column/Python/基础/env 环境变量管理.md"
},
{
"text": "__name__ 与 __main__",
"link": "/column/Python/基础/__name__ 与 __main__.md"
},
{
"text": "导入导出模块化",
"link": "/column/Python/基础/导入导出模块化.md"
},
{
"text": "函数与装饰器入门",
"link": "/column/Python/基础/函数与装饰器入门.md"
},
{
"text": "面向对象基础讲解",
"link": "/column/Python/基础/面向对象基础讲解.md"
},
{
"text": "异常处理",
"link": "/column/Python/基础/异常处理.md"
},
{
"text": "async 异步编程入门",
"link": "/column/Python/基础/async 异步编程入门.md"
},
{
"text": "with 语句与上下文管理",
"link": "/column/Python/基础/with 语句与上下文管理.md"
},
{
"text": "常用内置模块与 pathlib",
"link": "/column/Python/基础/常用内置模块与 pathlib.md"
},
{
"text": "基础项目环境搭建流程",
"link": "/column/Python/基础/基础项目环境搭建流程.md"
}
]
},
{
"text": "进阶",
"collapsed": false,
"items": [
{
"text": "Web框架 FastAPI",
"link": "/column/Python/进阶/Web框架 FastAPI.md"
},
{
"text": "typing 模块详解",
"link": "/column/Python/进阶/typing 模块详解.md"
},
{
"text": "Pydantic 数据验证",
"link": "/column/Python/进阶/Pydantic 数据验证.md"
},
{
"text": "requests 与 httpx",
"link": "/column/Python/进阶/requests 与 httpx.md"
},
{
"text": "SQLAlchemy 与数据库操作",
"link": "/column/Python/进阶/SQLAlchemy 与数据库操作.md"
}
]
}
],
"/column/AIFuture/": [
{
"text": "基础认知",
"collapsed": false,
"items": [
{
"text": "AI概念与AI Agent",
"link": "/column/AIFuture/基础认知/AI概念与AI Agent.md"
},
{
"text": "AI模型中的Token含义",
"link": "/column/AIFuture/基础认知/AI模型中的Token含义.md"
},
{
"text": "模型模型上下文与命中缓存",
"link": "/column/AIFuture/基础认知/模型模型上下文与命中缓存.md"
},
{
"text": "什么是提示词工程",
"link": "/column/AIFuture/基础认知/什么是提示词工程.md"
},
{
"text": "什么是RAG检索增强生成",
"link": "/column/AIFuture/基础认知/什么是RAG检索增强生成.md"
},
{
"text": "什么是模型蒸馏",
"link": "/column/AIFuture/基础认知/什么是模型蒸馏.md"
}
]
},
{
"text": "MCP",
"collapsed": false,
"items": [
{
"text": "MCP核心概念",
"link": "/column/AIFuture/MCP/MCP核心概念.md"
},
{
"text": "MCP端到端流程",
"link": "/column/AIFuture/MCP/MCP端到端流程.md"
},
{
"text": "MCP从零编写到发布上线",
"link": "/column/AIFuture/MCP/MCP从零编写到发布上线.md"
}
]
},
{
"text": "Skill",
"collapsed": false,
"items": [
{
"text": "Skill（技能）详解",
"link": "/column/AIFuture/Skill/Skill（技能）详解.md"
},
{
"text": "Skill 从零编写到发布上线",
"link": "/column/AIFuture/Skill/Skill 从零编写到发布上线.md"
}
]
},
{
"text": "AGENTS 规则约束",
"collapsed": false,
"items": [
{
"text": "什么是AGENTS.md",
"link": "/column/AIFuture/AGENTS 规则约束/什么是AGENTS.md.md"
},
{
"text": "前端专用AGENTS.md模板",
"link": "/column/AIFuture/AGENTS 规则约束/前端专用AGENTS.md模板.md"
},
{
"text": "后端专用AGENTS.md模板",
"link": "/column/AIFuture/AGENTS 规则约束/后端专用AGENTS.md模板.md"
}
]
}
],
"/column/Network/": [
{
"text": "网络基础",
"collapsed": false,
"items": [
{
"text": "OSI七层网络模型详解",
"link": "/column/Network/网络基础/OSI七层网络模型详解.md"
},
{
"text": "TCP-IP协议和三次握手",
"link": "/column/Network/网络基础/TCP-IP协议和三次握手.md"
},
{
"text": "浏览器输入URL发生了什么",
"link": "/column/Network/网络基础/浏览器输入URL发生了什么.md"
},
{
"text": "本地开发端口原理",
"link": "/column/Network/网络基础/本地开发端口原理.md"
},
{
"text": "网络常用命令集锦",
"link": "/column/Network/网络基础/网络常用命令集锦.md"
},
{
"text": "CDN资源不会产生跨域问题",
"link": "/column/Network/网络基础/CDN资源不会产生跨域问题.md"
},
{
"text": "获取本地时区和公网IP",
"link": "/column/Network/网络基础/获取本地时区和公网IP.md"
}
]
},
{
"text": "网络通信与传输",
"collapsed": false,
"items": [
{
"text": "HTTP基础讲解",
"link": "/column/Network/网络通信与传输/HTTP基础讲解.md"
},
{
"text": "HTTP1.1和HTTP2",
"link": "/column/Network/网络通信与传输/HTTP1.1和HTTP2.md"
},
{
"text": "HTTPS(TSL和SSL)",
"link": "/column/Network/网络通信与传输/HTTPS(TSL和SSL).md"
},
{
"text": "为什么 HTTPS 很安全，抓包工具却还能抓到包？",
"link": "/column/Network/网络通信与传输/为什么 HTTPS 很安全，抓包工具却还能抓到包？.md"
},
{
"text": "GET和POST请求区别",
"link": "/column/Network/网络通信与传输/GET和POST请求区别.md"
},
{
"text": "CDN内容分发网络",
"link": "/column/Network/网络通信与传输/CDN内容分发网络.md"
},
{
"text": "强缓存和协商缓存",
"link": "/column/Network/网络通信与传输/强缓存和协商缓存.md"
},
{
"text": "Fetch请求和Ajax",
"link": "/column/Network/网络通信与传输/Fetch请求和Ajax.md"
},
{
"text": "RESTful API设计规范",
"link": "/column/Network/网络通信与传输/RESTful API设计规范.md"
},
{
"text": "对象存储服务讲解",
"link": "/column/Network/网络通信与传输/对象存储服务讲解.md"
},
{
"text": "客户端数据库IndexedDB",
"link": "/column/Network/网络通信与传输/客户端数据库IndexedDB.md"
},
{
"text": "获取网络状态",
"link": "/column/Network/网络通信与传输/获取网络状态.md"
},
{
"text": "SSE流式传输",
"link": "/column/Network/网络通信与传输/SSE流式传输.md"
}
]
},
{
"text": "安全与数据上报",
"collapsed": false,
"items": [
{
"text": "XSS跨站脚本攻击与防御",
"link": "/column/Network/安全与数据上报/XSS跨站脚本攻击与防御.md"
},
{
"text": "跨域原理解决方案",
"link": "/column/Network/安全与数据上报/跨域原理解决方案.md"
},
{
"text": "JWT与Cookie讲解",
"link": "/column/Network/安全与数据上报/JWT与Cookie讲解.md"
},
{
"text": "数字证书简述",
"link": "/column/Network/安全与数据上报/数字证书简述.md"
},
{
"text": "添加埋点方式和原理",
"link": "/column/Network/安全与数据上报/添加埋点方式和原理.md"
},
{
"text": "sendBeacon可靠上报",
"link": "/column/Network/安全与数据上报/sendBeacon可靠上报.md"
},
{
"text": "OAuth2.0授权流程-1",
"link": "/column/Network/安全与数据上报/OAuth2.0授权流程-1.md"
},
{
"text": "OAuth2.0授权流程-2",
"link": "/column/Network/安全与数据上报/OAuth2.0授权流程-2.md"
},
{
"text": "HttpOnly签名Cookie登录方案",
"link": "/column/Network/安全与数据上报/HttpOnly签名Cookie登录方案.md"
}
]
},
{
"text": "工具与抓包分析",
"collapsed": false,
"items": [
{
"text": "Wireshark抓包分析实战",
"link": "/column/Network/工具与抓包分析/Wireshark抓包分析实战.md"
},
{
"text": "Ngrok内网穿透配置",
"link": "/column/Network/工具与抓包分析/Ngrok内网穿透配置.md"
}
]
}
],
"/column/Angular/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "概念",
"link": "/column/Angular/基础/概念.md"
},
{
"text": "模块",
"link": "/column/Angular/基础/模块.md"
},
{
"text": "组件",
"link": "/column/Angular/基础/组件.md"
},
{
"text": "模板语法与指令",
"link": "/column/Angular/基础/模板语法与指令.md"
},
{
"text": "数据绑定",
"link": "/column/Angular/基础/数据绑定.md"
},
{
"text": "管道Pipe",
"link": "/column/Angular/基础/管道Pipe.md"
},
{
"text": "服务和依赖注入",
"link": "/column/Angular/基础/服务和依赖注入.md"
},
{
"text": "表单",
"link": "/column/Angular/基础/表单.md"
},
{
"text": "生命周期实战",
"link": "/column/Angular/基础/生命周期实战.md"
},
{
"text": "装饰器",
"link": "/column/Angular/基础/装饰器.md"
},
{
"text": "变更检测",
"link": "/column/Angular/基础/变更检测.md"
},
{
"text": "http客户端",
"link": "/column/Angular/基础/http客户端.md"
},
{
"text": "Signal(信号)",
"link": "/column/Angular/基础/Signal(信号).md"
},
{
"text": "路由和导航",
"link": "/column/Angular/基础/路由和导航.md"
},
{
"text": "AngularCLI与项目结构",
"link": "/column/Angular/基础/AngularCLI与项目结构.md"
}
]
},
{
"text": "Ngrx",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/Angular/Ngrx/基本使用.md"
},
{
"text": "核心概念",
"link": "/column/Angular/Ngrx/核心概念.md"
},
{
"text": "完整状态管理流程",
"link": "/column/Angular/Ngrx/完整状态管理流程.md"
},
{
"text": "Entity与路由状态与ComponentStore",
"link": "/column/Angular/Ngrx/Entity与路由状态与ComponentStore.md"
}
]
},
{
"text": "RxJs",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/Angular/RxJs/基本使用.md"
},
{
"text": "Subject详解",
"link": "/column/Angular/RxJs/Subject详解.md"
},
{
"text": "操作符实战",
"link": "/column/Angular/RxJs/操作符实战.md"
},
{
"text": "订阅管理与内存泄漏",
"link": "/column/Angular/RxJs/订阅管理与内存泄漏.md"
}
]
}
],
"/column/TS/": [
{
"text": "基础类型系统",
"collapsed": false,
"items": [
{
"text": "ts介绍",
"link": "/column/TS/基础类型系统/ts介绍.md"
},
{
"text": "内置类型",
"link": "/column/TS/基础类型系统/内置类型.md"
},
{
"text": "索引签名",
"link": "/column/TS/基础类型系统/索引签名.md"
},
{
"text": "交叉类型",
"link": "/column/TS/基础类型系统/交叉类型.md"
},
{
"text": "泛型使用",
"link": "/column/TS/基础类型系统/泛型使用.md"
},
{
"text": "非空断言操作符",
"link": "/column/TS/基础类型系统/非空断言操作符.md"
},
{
"text": "as const类型收窄",
"link": "/column/TS/基础类型系统/as const类型收窄.md"
},
{
"text": "type和interface",
"link": "/column/TS/基础类型系统/type和interface.md"
},
{
"text": "字面量类型赋值问题",
"link": "/column/TS/基础类型系统/字面量类型赋值问题.md"
},
{
"text": "keyof T & on${string}组合",
"link": "/column/TS/基础类型系统/keyof T & on${string}组合.md"
},
{
"text": "unknown、never、any区别",
"link": "/column/TS/基础类型系统/unknown、never、any区别.md"
},
{
"text": "Object、object、{}区别",
"link": "/column/TS/基础类型系统/Object、object、{}区别.md"
}
]
},
{
"text": "类型工具",
"collapsed": false,
"items": [
{
"text": "Record类型",
"link": "/column/TS/类型工具/Record类型.md"
},
{
"text": "Partial类型",
"link": "/column/TS/类型工具/Partial类型.md"
},
{
"text": "Pick类型",
"link": "/column/TS/类型工具/Pick类型.md"
},
{
"text": "Omit类型",
"link": "/column/TS/类型工具/Omit类型.md"
},
{
"text": "Required类型",
"link": "/column/TS/类型工具/Required类型.md"
},
{
"text": "Exclude类型",
"link": "/column/TS/类型工具/Exclude类型.md"
},
{
"text": "Extract类型",
"link": "/column/TS/类型工具/Extract类型.md"
},
{
"text": "NonNullable类型",
"link": "/column/TS/类型工具/NonNullable类型.md"
}
]
},
{
"text": "工程化相关",
"collapsed": false,
"items": [
{
"text": "tsconfig.json配置文件",
"link": "/column/TS/工程化相关/tsconfig.json配置文件.md"
},
{
"text": "三斜线指令",
"link": "/column/TS/工程化相关/三斜线指令.md"
},
{
"text": "命名空间",
"link": "/column/TS/工程化相关/命名空间.md"
},
{
"text": "声明文件",
"link": "/column/TS/工程化相关/声明文件.md"
},
{
"text": "装饰器Decorator",
"link": "/column/TS/工程化相关/装饰器Decorator.md"
},
{
"text": "协变和逆变",
"link": "/column/TS/工程化相关/协变和逆变.md"
},
{
"text": "类型守卫",
"link": "/column/TS/工程化相关/类型守卫.md"
}
]
}
],
"/column/ProblemNotes/HtmlCss/": [
{
"text": "HTML",
"collapsed": false,
"items": [
{
"text": "HTML理论基础",
"link": "/column/ProblemNotes/HtmlCss/HTML/HTML理论基础.md"
},
{
"text": "HTML5新特性",
"link": "/column/ProblemNotes/HtmlCss/HTML/HTML5新特性.md"
},
{
"text": "HTML元数据标签及常用元素",
"link": "/column/ProblemNotes/HtmlCss/HTML/HTML元数据标签及常用元素.md"
},
{
"text": "HTML5视频做天气卡片背景",
"link": "/column/ProblemNotes/HtmlCss/HTML/HTML5视频做天气卡片背景.md"
}
]
},
{
"text": "CSS",
"collapsed": false,
"items": [
{
"text": "CSS理论知识点",
"link": "/column/ProblemNotes/HtmlCss/CSS/CSS理论知识点.md"
},
{
"text": "宽度100与宽度auto的区别",
"link": "/column/ProblemNotes/HtmlCss/CSS/宽度100与宽度auto的区别.md"
},
{
"text": "CSS的root选择器",
"link": "/column/ProblemNotes/HtmlCss/CSS/CSS的root选择器.md"
},
{
"text": "CSS预处理器和后处理器",
"link": "/column/ProblemNotes/HtmlCss/CSS/CSS预处理器和后处理器.md"
},
{
"text": "自动前缀autoprefixer",
"link": "/column/ProblemNotes/HtmlCss/CSS/自动前缀autoprefixer.md"
},
{
"text": "实现上下渐变的框线",
"link": "/column/ProblemNotes/HtmlCss/CSS/实现上下渐变的框线.md"
},
{
"text": "盒子水平垂直居中的几种方式",
"link": "/column/ProblemNotes/HtmlCss/CSS/盒子水平垂直居中的几种方式.md"
},
{
"text": "绝对定位与Flex布局冲突解决",
"link": "/column/ProblemNotes/HtmlCss/CSS/绝对定位与Flex布局冲突解决.md"
},
{
"text": "类选择器中间有无空格的区别",
"link": "/column/ProblemNotes/HtmlCss/CSS/类选择器中间有无空格的区别.md"
},
{
"text": "实现文本单行居中多行左对齐",
"link": "/column/ProblemNotes/HtmlCss/CSS/实现文本单行居中多行左对齐.md"
},
{
"text": "transform影响fixed定位",
"link": "/column/ProblemNotes/HtmlCss/CSS/transform影响fixed定位.md"
},
{
"text": "@media print 打印样式",
"link": "/column/ProblemNotes/HtmlCss/CSS/@media print 打印样式.md"
},
{
"text": "SVG与Canvas水印添加技术对比",
"link": "/column/ProblemNotes/HtmlCss/CSS/SVG与Canvas水印添加技术对比.md"
}
]
}
],
"/column/Git/": [
{
"text": "git相关",
"collapsed": false,
"items": [
{
"text": "git安装与常用命令",
"link": "/column/Git/git相关/git安装与常用命令.md"
},
{
"text": "github配置ssh密钥",
"link": "/column/Git/git相关/github配置ssh密钥.md"
},
{
"text": "工作中常用的git操作-1",
"link": "/column/Git/git相关/工作中常用的git操作-1.md"
},
{
"text": "工作中常用的git操作-2",
"link": "/column/Git/git相关/工作中常用的git操作-2.md"
},
{
"text": "git版本回退的两种方式",
"link": "/column/Git/git相关/git版本回退的两种方式.md"
},
{
"text": "git首次推送冲突完整解决流程",
"link": "/column/Git/git相关/git首次推送冲突完整解决流程.md"
},
{
"text": "git同时推送到多个远程仓库",
"link": "/column/Git/git相关/git同时推送到多个远程仓库.md"
},
{
"text": "git远程分支同步到本地",
"link": "/column/Git/git相关/git远程分支同步到本地.md"
},
{
"text": "git多人协作分支合并实战",
"link": "/column/Git/git相关/git多人协作分支合并实战.md"
}
]
}
],
"/column/Nginx/": [
{
"text": "Nginx服务器与部署",
"collapsed": false,
"items": [
{
"text": "核心概念",
"link": "/column/Nginx/Nginx服务器与部署/核心概念.md"
},
{
"text": "location匹配规则",
"link": "/column/Nginx/Nginx服务器与部署/location匹配规则.md"
},
{
"text": "alias和root区别",
"link": "/column/Nginx/Nginx服务器与部署/alias和root区别.md"
},
{
"text": "部署项目和代理",
"link": "/column/Nginx/Nginx服务器与部署/部署项目和代理.md"
},
{
"text": "负载均衡策略",
"link": "/column/Nginx/Nginx服务器与部署/负载均衡策略.md"
},
{
"text": "开启gzip压缩",
"link": "/column/Nginx/Nginx服务器与部署/开启gzip压缩.md"
},
{
"text": "开启域名跳转",
"link": "/column/Nginx/Nginx服务器与部署/开启域名跳转.md"
},
{
"text": "History路由404问题",
"link": "/column/Nginx/Nginx服务器与部署/History路由404问题.md"
},
{
"text": "ECS上用Nginx部署多个前端项目",
"link": "/column/Nginx/Nginx服务器与部署/ECS上用Nginx部署多个前端项目.md"
}
]
}
],
"/column/Docker/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "核心概念和安装",
"link": "/column/Docker/基础/核心概念和安装.md"
},
{
"text": "Docker的镜像与容器",
"link": "/column/Docker/基础/Docker的镜像与容器.md"
},
{
"text": "为什么使用 Docker 镜像",
"link": "/column/Docker/基础/为什么使用 Docker 镜像.md"
},
{
"text": "Dockerfile",
"link": "/column/Docker/基础/Dockerfile.md"
},
{
"text": "Docker Compose",
"link": "/column/Docker/基础/Docker Compose.md"
},
{
"text": "Docker网络",
"link": "/column/Docker/基础/Docker网络.md"
},
{
"text": "容器存储",
"link": "/column/Docker/基础/容器存储.md"
},
{
"text": "容器日志和监控",
"link": "/column/Docker/基础/容器日志和监控.md"
}
]
},
{
"text": "进阶",
"collapsed": false,
"items": [
{
"text": "Docker 镜像与网络隔离",
"link": "/column/Docker/进阶/Docker 镜像与网络隔离.md"
},
{
"text": "Docker本地部署CSR前端项目",
"link": "/column/Docker/进阶/Docker本地部署CSR前端项目.md"
},
{
"text": "Docker本地部署SSR前端项目",
"link": "/column/Docker/进阶/Docker本地部署SSR前端项目.md"
}
]
}
],
"/column/Linux/": [
{
"text": "基础入门",
"collapsed": false,
"items": [
{
"text": "Linux 简介与常见发行版",
"link": "/column/Linux/基础入门/Linux 简介与常见发行版.md"
},
{
"text": "目录结构与基础命令",
"link": "/column/Linux/基础入门/目录结构与基础命令.md"
},
{
"text": "文件权限与用户管理",
"link": "/column/Linux/基础入门/文件权限与用户管理.md"
},
{
"text": "包管理器使用 apt、yum",
"link": "/column/Linux/基础入门/包管理器使用 apt、yum.md"
},
{
"text": "环境变量与软硬链接",
"link": "/column/Linux/基础入门/环境变量与软硬链接.md"
}
]
},
{
"text": "系统管理",
"collapsed": false,
"items": [
{
"text": "进程管理（ps、top、kill）",
"link": "/column/Linux/系统管理/进程管理（ps、top、kill）.md"
},
{
"text": "systemd 服务管理",
"link": "/column/Linux/系统管理/systemd 服务管理.md"
},
{
"text": "定时任务（cron）",
"link": "/column/Linux/系统管理/定时任务（cron）.md"
},
{
"text": "磁盘与文件系统管理",
"link": "/column/Linux/系统管理/磁盘与文件系统管理.md"
},
{
"text": "系统日志查看",
"link": "/column/Linux/系统管理/系统日志查看.md"
}
]
},
{
"text": "网络与安全",
"collapsed": false,
"items": [
{
"text": "网络常用命令",
"link": "/column/Linux/网络与安全/网络常用命令.md"
},
{
"text": "防火墙基础",
"link": "/column/Linux/网络与安全/防火墙基础.md"
},
{
"text": "SSH 使用与免密登录",
"link": "/column/Linux/网络与安全/SSH 使用与免密登录.md"
}
]
}
],
"/column/Aliyun/": [
{
"text": "核心概念",
"collapsed": false,
"items": [
{
"text": "阿里云 ECS 入门介绍",
"link": "/column/Aliyun/核心概念/阿里云 ECS 入门介绍.md"
},
{
"text": "阿里云的容器镜像ACR",
"link": "/column/Aliyun/核心概念/阿里云的容器镜像ACR.md"
},
{
"text": "阿里云安全组和服务器防火墙",
"link": "/column/Aliyun/核心概念/阿里云安全组和服务器防火墙.md"
},
{
"text": "为什么前端项目部署需要nginx",
"link": "/column/Aliyun/核心概念/为什么前端项目部署需要nginx.md"
},
{
"text": "GitHub Actions 核心概念详解",
"link": "/column/Aliyun/核心概念/GitHub Actions 核心概念详解.md"
},
{
"text": "PM2在Next项目部署中的作用",
"link": "/column/Aliyun/核心概念/PM2在Next项目部署中的作用.md"
}
]
},
{
"text": "实战部署",
"collapsed": false,
"items": [
{
"text": "VitePress博客自动部署到ECS",
"link": "/column/Aliyun/实战部署/VitePress博客自动部署到ECS.md"
},
{
"text": "Next.js项目自动部署到ECS-prompt案例",
"link": "/column/Aliyun/实战部署/Next.js项目自动部署到ECS-prompt案例.md"
},
{
"text": "OSS图片加载实时转JPG方案",
"link": "/column/Aliyun/实战部署/OSS图片加载实时转JPG方案.md"
},
{
"text": "Nuxt.js项目自动部署到ECS-个人档案",
"link": "/column/Aliyun/实战部署/Nuxt.js项目自动部署到ECS-个人档案.md"
},
{
"text": "ECS+Nginx配置二级域名与多项目部署实战",
"link": "/column/Aliyun/实战部署/ECS+Nginx配置二级域名与多项目部署实战.md"
},
{
"text": "PythonWeb项目发布到ECS实战",
"link": "/column/Aliyun/实战部署/PythonWeb项目发布到ECS实战.md"
},
{
"text": "React+Node+SQLite项目自动发布到ECS实战-git看板",
"link": "/column/Aliyun/实战部署/React+Node+SQLite项目自动发布到ECS实战-git看板.md"
},
{
"text": "Next.js+SQLite项目自动部署到ECS全流程",
"link": "/column/Aliyun/实战部署/Next.js+SQLite项目自动部署到ECS全流程.md"
},
{
"text": "React+Node+SQLite项目自动发布到ECS实战-天气看板",
"link": "/column/Aliyun/实战部署/React+Node+SQLite项目自动发布到ECS实战-天气看板.md"
},
{
"text": "Next项目+Docker自动部署到ECS实战-个人站点",
"link": "/column/Aliyun/实战部署/Next项目+Docker自动部署到ECS实战-个人站点.md"
},
{
"text": "React+Python+Mysql+Docker自动部署到ECS实战-ai聊天",
"link": "/column/Aliyun/实战部署/React+Python+Mysql+Docker自动部署到ECS实战-ai聊天.md"
}
]
},
{
"text": "踩坑记录",
"collapsed": false,
"items": [
{
"text": "ECS中通过SSH克隆GitHub仓库",
"link": "/column/Aliyun/踩坑记录/ECS中通过SSH克隆GitHub仓库.md"
}
]
}
],
"/column/ProblemNotes/miniProgram/": [
{
"text": "uniApp",
"collapsed": false,
"items": [
{
"text": "1. 页面常用的生命周期",
"link": "/column/ProblemNotes/miniProgram/uniApp/页面常用的生命周期.md"
},
{
"text": "2. uniApp中使用pinia状态管理库与持久化",
"link": "/column/ProblemNotes/miniProgram/uniApp/uniApp中使用pinia状态管理库与持久化.md"
},
{
"text": "3. 自动按需引入组件(easycom)",
"link": "/column/ProblemNotes/miniProgram/uniApp/自动按需引入组件(easycom).md"
}
]
},
{
"text": "weixin",
"collapsed": false,
"items": [
{
"text": "1. 微信小程序的登录流程",
"link": "/column/ProblemNotes/miniProgram/weixin/微信小程序的登录流程.md"
},
{
"text": "2. 微信小程序返回上一个页面并刷新数据",
"link": "/column/ProblemNotes/miniProgram/weixin/微信小程序返回上一个页面并刷新数据.md"
},
{
"text": "3. 微信小程序页面之间传参的几种方式",
"link": "/column/ProblemNotes/miniProgram/weixin/微信小程序页面之间传参的几种方式.md"
}
]
},
{
"text": "alipay",
"collapsed": false,
"items": [
{
"text": "1. 支付宝不支持将自定义组件当page使用",
"link": "/column/ProblemNotes/miniProgram/alipay/支付宝不支持将自定义组件当page使用.md"
},
{
"text": "2. 支付宝小程序引导用户开启定位",
"link": "/column/ProblemNotes/miniProgram/alipay/支付宝小程序引导用户开启定位.md"
}
]
}
],
"/column/前端进阶/": [
{
"text": "性能优化",
"collapsed": false,
"items": [
{
"text": "防抖和节流函数细节",
"link": "/column/前端进阶/性能优化/防抖和节流函数细节.md"
},
{
"text": "NProgress页面加载进度条原理",
"link": "/column/前端进阶/性能优化/NProgress页面加载进度条原理.md"
},
{
"text": "VitePress首屏加载优化实战",
"link": "/column/前端进阶/性能优化/VitePress首屏加载优化实战.md"
},
{
"text": "前端图片加载优化全链路方案",
"link": "/column/前端进阶/性能优化/前端图片加载优化全链路方案.md"
},
{
"text": "前端图片瀑布流实现方案详解",
"link": "/column/前端进阶/性能优化/前端图片瀑布流实现方案详解.md"
},
{
"text": "顶部阅读进度条的方案实现",
"link": "/column/前端进阶/性能优化/顶部阅读进度条的方案实现.md"
}
]
},
{
"text": "架构与原理",
"collapsed": false,
"items": [
{
"text": "import动态导入使用与高级应用",
"link": "/column/前端进阶/架构与原理/import动态导入使用与高级应用.md"
},
{
"text": "客户端和服务器端渲染区别",
"link": "/column/前端进阶/架构与原理/客户端和服务器端渲染区别.md"
},
{
"text": "构建时Hash与ContentHash的差异详解",
"link": "/column/前端进阶/架构与原理/构建时Hash与ContentHash的差异详解.md"
},
{
"text": "前端运行时与编译时的理解",
"link": "/column/前端进阶/架构与原理/前端运行时与编译时的理解.md"
}
]
},
{
"text": "工程化",
"collapsed": false,
"items": [
{
"text": "前端发版后实现提醒用刷新页面策略",
"link": "/column/前端进阶/工程化/前端发版后实现提醒用刷新页面策略.md"
},
{
"text": "移动端H5适配方案实践",
"link": "/column/前端进阶/工程化/移动端H5适配方案实践.md"
},
{
"text": "网站主题切换的原理与最佳实践",
"link": "/column/前端进阶/工程化/网站主题切换的原理与最佳实践.md"
},
{
"text": "前端 Monorepo 指南",
"link": "/column/前端进阶/工程化/前端 Monorepo 指南.md"
}
]
},
{
"text": "网络安全",
"collapsed": false,
"items": [
{
"text": "前端常用加密方式",
"link": "/column/前端进阶/网络安全/前端常用加密方式.md"
}
]
},
{
"text": "数据埋点",
"collapsed": false,
"items": [
{
"text": "神策埋点",
"link": "/column/前端进阶/数据埋点/神策埋点.md"
}
]
},
{
"text": "设计原则",
"collapsed": false,
"items": [
{
"text": "软件设计五大核心原则",
"link": "/column/前端进阶/设计原则/软件设计五大核心原则.md"
}
]
},
{
"text": "登录鉴权",
"collapsed": false,
"items": [
{
"text": "APP扫码登录的实现原理",
"link": "/column/前端进阶/登录鉴权/APP扫码登录的实现原理.md"
},
{
"text": "邀请新用户返利链接的实现原理",
"link": "/column/前端进阶/登录鉴权/邀请新用户返利链接的实现原理.md"
},
{
"text": "现代桌面应用跳转浏览器登录方案解析",
"link": "/column/前端进阶/登录鉴权/现代桌面应用跳转浏览器登录方案解析.md"
}
]
}
],
"/column/数据库/": [
{
"text": "MySQL",
"collapsed": false,
"items": [
{
"text": "关系型和非关系型数据库",
"link": "/column/数据库/MySQL/关系型和非关系型数据库.md"
},
{
"text": "数据类型",
"link": "/column/数据库/MySQL/数据类型.md"
},
{
"text": "基础语法",
"link": "/column/数据库/MySQL/基础语法.md"
},
{
"text": "SQL查询的本质",
"link": "/column/数据库/MySQL/SQL查询的本质.md"
},
{
"text": "事务理解",
"link": "/column/数据库/MySQL/事务理解.md"
},
{
"text": "关联关系",
"link": "/column/数据库/MySQL/关联关系.md"
},
{
"text": "JOIN连接操作",
"link": "/column/数据库/MySQL/JOIN连接操作.md"
},
{
"text": "表达式和函数",
"link": "/column/数据库/MySQL/表达式和函数.md"
},
{
"text": "实战演练",
"link": "/column/数据库/MySQL/实战演练.md"
},
{
"text": "请求数据",
"link": "/column/数据库/MySQL/请求数据.md"
},
{
"text": "knex",
"link": "/column/数据库/MySQL/knex.md"
},
{
"text": "prisma",
"link": "/column/数据库/MySQL/prisma.md"
},
{
"text": "better-sqlite3",
"link": "/column/数据库/MySQL/better-sqlite3.md"
}
]
}
],
"/column/ProblemNotes/踩坑记录/": [
{
"text": "踩坑记录",
"collapsed": false,
"items": [
{
"text": "项目部署后静态资源404问题",
"link": "/column/ProblemNotes/踩坑记录/项目部署后静态资源404问题.md"
},
{
"text": "Vue2使用sort排序导致死循环",
"link": "/column/ProblemNotes/踩坑记录/Vue2使用sort排序导致死循环.md"
},
{
"text": "IOS橡皮筋滚动回弹效果异常修复",
"link": "/column/ProblemNotes/踩坑记录/IOS橡皮筋滚动回弹效果异常修复.md"
},
{
"text": "IOS系统video标签poster属性兼容性处理",
"link": "/column/ProblemNotes/踩坑记录/IOS系统video标签poster属性兼容性处理.md"
},
{
"text": "Mac钉钉微应用流式输出TypeError Load failed错误排查",
"link": "/column/ProblemNotes/踩坑记录/Mac钉钉微应用流式输出TypeError Load failed错误排查.md"
},
{
"text": "前端流式输出数据被浏览器截断",
"link": "/column/ProblemNotes/踩坑记录/前端流式输出数据被浏览器截断.md"
},
{
"text": "项目发版后浏览器缓存问题",
"link": "/column/ProblemNotes/踩坑记录/项目发版后浏览器缓存问题.md"
},
{
"text": "React19高危RCE漏洞预警与修复",
"link": "/column/ProblemNotes/踩坑记录/React19高危RCE漏洞预警与修复.md"
},
{
"text": "移动端软键盘弹出时会把fixed底部按钮顶上去",
"link": "/column/ProblemNotes/踩坑记录/移动端软键盘弹出时会把fixed底部按钮顶上去.md"
},
{
"text": "录入to find mores使后端报错",
"link": "/column/ProblemNotes/踩坑记录/录入to find mores使后端报错.md"
},
{
"text": "跨源资源共享存在不安全配置漏洞",
"link": "/column/ProblemNotes/踩坑记录/跨源资源共享存在不安全配置漏洞.md"
},
{
"text": "Nextjs16页面循环刷新问题",
"link": "/column/ProblemNotes/踩坑记录/Nextjs16页面循环刷新问题.md"
},
{
"text": "iOS底部TabBar安全区适配",
"link": "/column/ProblemNotes/踩坑记录/iOS底部TabBar安全区适配.md"
},
{
"text": "钉钉H5微应用页面缓存问题",
"link": "/column/ProblemNotes/踩坑记录/钉钉H5微应用页面缓存问题.md"
},
{
"text": "vant workspace协议泄漏排查实战",
"link": "/column/ProblemNotes/踩坑记录/vant workspace协议泄漏排查实战.md"
}
]
}
],
"/column/ProblemNotes/组件封装与文件处理/": [
{
"text": "组件封装",
"collapsed": false,
"items": [
{
"text": "png序列动画",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/png序列动画.md"
},
{
"text": "可编辑模板字符串",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/可编辑模板字符串.md"
},
{
"text": "各格式文件预览",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/各格式文件预览.md"
},
{
"text": "录音组件",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/录音组件.md"
},
{
"text": "移动端B站风格弹幕系统实现方案",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/移动端B站风格弹幕系统实现方案.md"
},
{
"text": "移动端下拉刷新功能的实现",
"link": "/column/ProblemNotes/组件封装与文件处理/组件封装/移动端下拉刷新功能的实现.md"
}
]
},
{
"text": "表单与表格专题",
"collapsed": false,
"items": [
{
"text": "实现[记住密码]功能",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/实现[记住密码]功能.md"
},
{
"text": "常用form表单验证",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/常用form表单验证.md"
},
{
"text": "form表单嵌套table表格",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/form表单嵌套table表格.md"
},
{
"text": "动态切换不同form表单",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/动态切换不同form表单.md"
},
{
"text": "合并行列且循环的table表格",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/合并行列且循环的table表格.md"
},
{
"text": "移动端的table表格实现",
"link": "/column/ProblemNotes/组件封装与文件处理/表单与表格专题/移动端的table表格实现.md"
}
]
},
{
"text": "文件处理专题",
"collapsed": false,
"items": [
{
"text": "前端文件处理完全指南：File、Blob、Base64转换",
"link": "/column/ProblemNotes/组件封装与文件处理/文件处理专题/前端文件处理完全指南：File、Blob、Base64转换.md"
},
{
"text": "前端实现文件下载的完整流程",
"link": "/column/ProblemNotes/组件封装与文件处理/文件处理专题/前端实现文件下载的完整流程.md"
},
{
"text": "前端PDF渲染与下载实现",
"link": "/column/ProblemNotes/组件封装与文件处理/文件处理专题/前端PDF渲染与下载实现.md"
},
{
"text": "把页面导出为PDF",
"link": "/column/ProblemNotes/组件封装与文件处理/文件处理专题/把页面导出为PDF.md"
},
{
"text": "使用 XLSX.js 导出 Excel 文件",
"link": "/column/ProblemNotes/组件封装与文件处理/文件处理专题/使用 XLSX.js 导出 Excel 文件.md"
}
]
}
],
"/column/Poetry/": [
{
"text": "诗词相关",
"collapsed": false,
"items": [
{
"text": "词牌名",
"items": [
{
"text": "蝶恋花",
"link": "/column/Poetry/诗词相关/词牌名/蝶恋花.md"
},
{
"text": "浣溪沙",
"link": "/column/Poetry/诗词相关/词牌名/浣溪沙.md"
},
{
"text": "菩萨蛮",
"link": "/column/Poetry/诗词相关/词牌名/菩萨蛮.md"
},
{
"text": "临江仙",
"link": "/column/Poetry/诗词相关/词牌名/临江仙.md"
}
]
},
{
"text": "田园风光",
"link": "/column/Poetry/诗词相关/田园风光.md"
},
{
"text": "相思别离",
"link": "/column/Poetry/诗词相关/相思别离.md"
},
{
"text": "寓情于景",
"link": "/column/Poetry/诗词相关/寓情于景.md"
},
{
"text": "名句总结",
"link": "/column/Poetry/诗词相关/名句总结.md"
},
{
"text": "人性",
"link": "/column/Poetry/诗词相关/人性.md"
}
]
}
],
"/column/CommonSense/": [
{
"text": "生活常识",
"collapsed": false,
"items": [
{
"text": "廿四节气",
"link": "/column/CommonSense/生活常识/廿四节气.md"
},
{
"text": "开车技巧",
"link": "/column/CommonSense/生活常识/开车技巧.md"
},
{
"text": "汽车车险",
"link": "/column/CommonSense/生活常识/汽车车险.md"
},
{
"text": "园区停车系统总结",
"link": "/column/CommonSense/生活常识/园区停车系统总结.md"
},
{
"text": "为什么发票填了公司就能报销？",
"link": "/column/CommonSense/生活常识/为什么发票填了公司就能报销？.md"
},
{
"text": "个人所得税已缴税额详解",
"link": "/column/CommonSense/生活常识/个人所得税已缴税额详解.md"
}
]
}
]
},
"outline": {
"level": [
2,
6
],
"label": "本页目录"
},
"socialLinks": [
{
"icon": "github",
"link": "https://github.com/gouxinjie"
},
{
"icon": "gitee",
"link": "https://gitee.com/gou-xinjie"
}
],
"lastUpdatedText": "最近更新",
"lastUpdated": {
"text": "最后更新于",
"formatOptions": {
"dateStyle": "short",
"timeStyle": "medium"
}
},
"footer": {
"message": "",
"copyright": ""
},
"docFooter": {
"prev": "前一篇",
"next": "后一篇"
},
"search": {
"provider": "algolia",
"options": {
"appId": "VDXJP5CTIA",
"apiKey": "f0fc71dd05d2daf1a73e3765c484bee6",
"indexName": "gouxinjieio"
}
},
"returnToTopLabel": "回到顶部",
"sidebarMenuLabel": "菜单",
"darkModeSwitchLabel": "主题",
"lightModeSwitchTitle": "切换到浅色模式",
"darkModeSwitchTitle": "切换到深色模式"
}Page Data
{
"title": "Runtime API Examples",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "api-examples.md",
"filePath": "api-examples.md",
"lastUpdated": 1756950424000
}Page Frontmatter
{
"outline": "deep"
}More
Check out the documentation for the full list of runtime APIs.