vuepress侧边栏配置_vuepress的侧边栏怎么动态生成
\自己去除一下,复制到这边被转义了
const fs \= require("fs");
const path \= require("path");
const rootpath \= path.dirname(\_\_dirname);
/\*\*
\* string比较工具类
\*/
const str \= {
contains: function(string, substr, isIgnoreCase) {
if (isIgnoreCase) {
string \= string.toLowerCase();
substr \= substr.toLowerCase();
}
var startChar \= substr.substring(0, 1);
var strLen \= substr.length;
for (var j \= 0; j < string.length \- strLen + 1; j++) {
if (string.charAt(j) \== startChar) {
//如果匹配起始字符,开始查找
if (string.substring(j, j + strLen) \== substr) {
//如果从j开始的字符与str匹配,那ok
return true;
}
}
}
return false;
}
};
/\*\*
\* 文件助手: 主要用于读取当前文件下的所有目录和文件
\*/
const filehelper \= {
getAllFiles: function(rpath) {
let filenames \= \[\];
fs.readdirSync(rpath).forEach(file \=> {
fullpath \= rpath + "/" + file;
var fileinfo \= fs.statSync(fullpath);
// 过滤 .DS\_Store
if (fileinfo.isFile() && !str.contains(file, "DS\_Store", true)) {
if (file \=== "README.md" || file \=== "readme.md") {
file \= "";
} else {
file \= file.replace(".md", "");
}
filenames.push(file);
}
});
filenames.sort();
return filenames;
},
getAllDirs: function getAllDirs(mypath \= ".") {
const items \= fs.readdirSync(mypath);
let result \= \[\];
// 遍历当前目录中所有文件夹
items.map(item \=> {
let temp \= path.join(mypath, item);
// 过滤无关的文件夹
if (
fs.statSync(temp).isDirectory() &&
!item.startsWith(".") &&
!str.contains(item, "DS\_Store", true)
) {
let path \= mypath + "/" + item + "/";
result.push(path);
result \= result.concat(getAllDirs(temp));
}
});
return result;
}
};
// nav的链接路径
var navLinks \= \[\];
// 侧边栏
var sidebar \= {};
// 导航栏
var nav \= getNav();
function genSideBar() {
var sidebars \= {};
var allDirs \= filehelper.getAllDirs(rootpath);
allDirs.forEach(item \=> {
let dirFiles \= filehelper.getAllFiles(item);
let dirname \= item.replace(rootpath, "");
navLinks.push(dirname);
if (dirFiles.length \> 1) {
sidebars\[dirname\] \= dirFiles;
}
});
sidebar \= sidebars;
}
/\*\*
\* 先生成所有nav文件链接;
\* @param filepaths
\* @returns {Array}
\*/
function genNavLink(filepaths) {
genSideBar();
var navLinks \= \[\];
filepaths.forEach(p \=> {
var ss \= p.toString().split("/");
var name \= ss\[ss.length \- 2\];
var parent \= p.replace(name + "/", "");
navLinks.push({
text: name,
link: p,
items: \[\],
parent: parent
});
});
return navLinks;
}
/\*\*
\* 自定义排序文件夹
\* @param a
\* @param b
\* @returns {number}
\*/
function sortDir(a, b) {
let al \= a.parent.toString().split("/").length;
let bl \= b.parent.toString().split("/").length;
if (al \> bl) {
return \-1;
}
if (al \=== bl) {
return 0;
}
if (al < bl) {
return 1;
}
}
/\*\*
\* 生成最终的 nav配置信息
\* @param navLinks
\* @returns {Array}
\*/
function getNav() {
let nnavs \= genNavLink(navLinks);
nnavs.sort(sortDir);
var iniMap \= {};
var result \= \[\];
var delMap \= {};
nnavs.forEach(l \=> {
iniMap\[l.link\] \= l;
});
nnavs.forEach(l \=> {
var parentLink \= l.parent;
if (parentLink !== "/") {
iniMap\[parentLink\].items.push(l);
delMap\[l.link\] \= l;
}
});
for (var k in iniMap) {
if (delMap\[k\] != null) {
delete iniMap\[k\];
continue;
}
result.push(iniMap\[k\]);
}
return result;
}
/\*\*
\* Vuepress 最终需要的配置信息, 修改其他信息在此处配置
\*/
var config \= {
title: "title",
description: "description",
lang: "zh-CN",
head: \[\["link", { rel: "icon", href: "/logo.png" }\]\],
themeConfig: {
sidebar: sidebar,
nav: nav,
sidebarDepth: 3
}
};
module.exports \= config;
vuepress侧边栏配置_vuepress的侧边栏怎么动态生成相关推荐
- vuepress侧边栏配置_VuePress搭建静态博客网站
VuePress是什么 仅从单词上来看就是vue和press,press除了按压的意思外,还有报刊杂志和出版社等意思,所以可以理解为由vue驱动的出版工具.换个说法就是静态博客编写工具.后六字应该都不 ...
- vuepress侧边栏配置_VuePress默认主题配置(default theme config) - VuePress中文网
# 默认主题配置(default theme config) 提示 此页面上列出的所有选项仅适用于默认主题.如果你使用的是自定义主题,则选项可能会有所不同. # 主页(Homepage) 默认主题提供 ...
- ABAP动态编程-动态生成子例程和本地类-GENERATE SUBROUTINE POOL
目录 前言 1. 动态生成子例程并调用 2. 动态生成本地类并调用 前言 本文为ABAP编程中动态生成子例程/本地类的简单示例,依托语句GENERATE SUBROUTINE POOL实现. 1. 动 ...
- 侧边栏配置_企业微信上线“聊天侧边栏”功能,可在外部会话时快捷使用应用...
点击上方"蓝色字体",选择 "设为星标" 关键讯息,D1时间送达! 8月7日消息,企业微信发布全新2.8.10版本,新增"聊天侧边栏"功能, ...
- Ubuntu18.04的网络配置(静态IP和动态IP) - OpsDrip - 博客园
Ubuntu18.04的网络配置(静态IP和动态IP) - OpsDrip - 博客园
- JAVA基础加强(张孝祥)_类加载器、分析代理类的作用与原理及AOP概念、分析JVM动态生成的类、实现类似Spring的可配置的AOP框架...
1.类加载器 ·简要介绍什么是类加载器,和类加载器的作用 ·Java虚拟机中可以安装多个类加载器,系统默认三个主要类加载器,每个类负责加载特定位置的类:BootStrap,ExtClassLoader ...
- mybatis使用注解替代xml配置,动态生成Sql
mybatis使用注解替代xml配置时,遇到判断条件是否为null或者为空时,@Select很难搞定,不知道怎么办? mybatis3中增加了使用注解来配置Mapper的新特性,使用 SelectPr ...
- eigrp配置实验_路由器 OSPF 动态路由配置
本文档详细介绍路由器 OSPF 动态路由配置的方法,文内含长段代码可复制可往左滑,希望对大家有帮助! 实验目的 掌握 OSPF 协议的配置方法 掌握查看通过动态路由协议 OSPF 学习产生的路由 熟悉 ...
- WCF读取配置动态生成客户端对象
转载自CSDN的ALLsharps 原始链接:http://blog.csdn.net/allsharps/article/details/7356301 写一个类,用于动态生成WCFClient对象 ...
最新文章
- RandomForest:随机森林预测生物标记biomarker——分类
- 北师大毕彦超:AI和人类感知的相同点和不同点
- evga x58服务器芯片组,为六核980X而生 EVGA发布X58 FTW3主板
- 世界上最牛的网络设备,价格低廉,其貌不扬......
- 不可多得的Javascript(AJAX)开发工具 - Aptana
- FFmpeg 4.2“艾达”发布
- 大数据分析 es hive_使用Hive和iReport进行大数据分析
- mysql协议重传,MySQL · 源码分析 · 网络通信模块浅析
- 【剑指offer】旋转数组的最小数字
- pyqt5使用按钮跳转界面
- SQL2005服务器上安装SQL2008失败
- Linux下配置安装NFS
- ➤mobi➢azw3➢epub⇨电子书阅读器 转换器
- Racket编程指南——3 内置的数据类型
- Mybatis Generator最完整配置详解 叩丁狼教育
- websphere使用_使用WebSphere sMash为Google小工具提供动力
- ElasticStack:使用FileBeat、Logstash、Elasticsearch、Kibana收集清洗存储查看分析数据
- win11点击任务栏音量、无线、电池按钮无反应的解决过程
- PS动效插件imagemotion汉化版
- MODISL1B数据FLAASH大气校正
热门文章
- 字节跳动 ClickHouse 在实时场景中的应用和优化实践
- MATLAB数据处理快速学习教程
- MapReduce编程实战之“初识”
- Pytorch运行时报错No module named ‘matplotlib‘--解决办法
- QT中写一个求QVector容器中数据均值的函数
- 流式机器学习算法的入门和认知
- android告别篇-对于源码我的一些看法
- 区块链基础设施纵览:基本框架原则——揭示存储、计算和通信元素
- tomcat:there is no resources that can be added or removed from server
- java 并发编程第七章:取消和关闭