vuepress的自帶路由是很差用的,當你使用自動生成時,就不能生成一級分類,只能根據文章標題創建二級標題,那麼若是你想要生成一個帶有一級分類的子文章,那麼你須要手動配置這樣的配置javascript
{ title: "xxx", collapsable: false, children: [ 'code-style/code', 'code-style/browser-fix', 'code-style/js-code' ] }
每次更新時,還須要手動向列表添加children,這是很是麻煩的,因此下面筆者提供了一個函數來處理這樣的問題vue
const fs = require('fs') const path = require('path') function getChildren(path) { const root = [] readDirSync(path,root) return root } function readDirSync(path,root){ var pa = fs.readdirSync(path); pa.forEach(function(ele,index){ var info = fs.statSync(path+"/"+ele) if(info.isDirectory()) { readDirSync(path+ele,root) } else { if (checkFileType(ele)) { root.push(prefixPath(path,ele)) } } }) } function checkFileType(path) { return path.includes(".md") } function prefixPath(basePath,dirPath) { let index = basePath.indexOf("/") // 去除一級目錄地址 basePath = basePath.slice(index,path.length) // replace用於處理windows電腦的路徑用\表示的問題 return path.join(basePath,dirPath).replace(/\\/g,"/") } module.exports = { getChildren:getChildren }
經過調用getChildren(basePath)
方法就能夠得到對應basePath
目錄下的全部博客,即便是子目錄,函數也會幫你正確的返回!可是爲了保證函數處理過程的正確性,你傳的目錄格式必須符合docs/xxx/xxx/
,不然函數和webpack都不能正確的幫你生成數據。java
爲了保證你的目錄是符合要求的,你能夠使用仿製如下幫助函數來生成basePath
webpack
/** * @return {string} */ // xxx就是你的博客文件所在的一級目錄,dirPath爲二級目錄 function createFilePath(dirPath) { return `docs/xxx/${dirPath}/` // `docs/study/${dirPath}/` }