Appearance
使用 vitepress 遇到的一些坑
按照文档配置侧边栏浏览器报错
TIP
2022/06/05「此问题已被官方已解决」
文档里是这样写的:
js
export default {
themeConfig: {
sidebar: {
// This sidebar gets displayed when user is
// under `guide` directory.
'/guide/': {
text: 'Guide',
items: [
// This shows `/guide/index.md` page.
{ text: 'Index', link: '/guide/' }, // /guide/index.md
{ text: 'One', link: '/guide/one' }, // /guide/one.md
{ text: 'Two', link: '/guide/two' }, // /guide/two.md
],
},
},
},
}
如果按照文档写法来进行操作的话,会导致浏览器报错。
sidebar.js:23 Uncaught (in promise) TypeError: sidebar is not iterable
at getFlatSideBarLinks (sidebar.js:23:25)
at ReactiveEffect.fn (prev-next.js:9:28)
at ReactiveEffect.run (reactivity.esm-bundler.js:185:25)
at get value [as value] (reactivity.esm-bundler.js:1144:39)
at unref (reactivity.esm-bundler.js:1052:29)
at Object.get (reactivity.esm-bundler.js:1055:37)
at Proxy._sfc_render (VPDocFooter.vue:17:17)
at renderComponentRoot (runtime-core.esm-bundler.js:896:44)
at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5646:34)
at ReactiveEffect.run (reactivity.esm-bundler.js:185:25)
这里其实需要一个数组,稍加改造就不会报错了:
js
export default {
themeConfig: {
sidebar: {
// This sidebar gets displayed when user is
// under `guide` directory.
'/guide/': [
{
text: 'Guide',
items: [
// This shows `/guide/index.md` page.
{ text: 'Index', link: '/guide/' }, // /guide/index.md
{ text: 'One', link: '/guide/one' }, // /guide/one.md
{ text: 'Two', link: '/guide/two' }, // /guide/two.md
],
},
],
},
},
}