如何解决如何让 vuepress 动态创建侧边导航?
我正在尝试简化视图新闻网站的创建,这样我就不必在左侧导航中手动添加条目。
到目前为止我尝试过
"vuepress-auto-sidebar": "^1.1.1"
但它也会呈现 .git
和 node_modules
文件夹。它也不呈现标题。
不仅没有在我的项目的根目录中呈现名为 upload.md
的文件。
我想我可能只需要通过执行某种形式的目录扫描来手动对其进行编码(尽管我不确定如何“观察”它,以便在我添加新文件时它会更新)。
到目前为止我解决这个问题的方法是配置 theme-config 来删除错误的模块。
sidebar: sidebar
.getSidebar()
.filter((v) => v.path !== "/node_modules/" && v.path !== "/.git/"),
然后向其添加过滤器会跳过 .git
和 node_modules
文件夹。之后,我必须解析 Markdown 以提取标题。
解决方法
编辑:通常,您确实将 .md
文档写入 docs
目录(不在项目的根目录中),然后使用它(来自 package.json
)启动它
vuepress dev docs --no-clear-screen --open
至于侧边栏,我的第一个答案在下面。
来自这个 github 问题:https://github.com/vuejs/vuepress/issues/613
您可以看到这不是开箱即用的。因此,您可以使用那里提供的一些解决方案并自行生成它,但您也可以尝试使用名为 vuepress-bar 的 npm 包。
效果很好!请注意,我在升级到 Nuxt 2.15.2 后遇到了一些不兼容问题,不确定是否仍然如此,但是这种方式根本无法运行 vuepress 非常烦人。
,我最终选择了一个不同的插件 vuepress-bar
但仍然需要实现过滤器
const getConfig = require("vuepress-bar");
const { nav,sidebar } = getConfig();
module.exports = {
themeConfig: {
nav,sidebar: sidebar.filter(i => i.title !== "Node Modules"),smoothScroll: true
}
};
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。