vuepress-theme-vdoing vuepress-theme-vdoing
首页
  • 主题初衷与诞生
  • 介绍
  • 快速上手
  • 目录结构
  • 核心配置和约定
  • 自动生成front matter
  • Markdown 容器
  • Markdown 中使用组件
  • 相关文章

    • 使目录栏支持h2~h6标题
    • 如何让你的笔记更有表现力
    • 批量操作front matter工具
    • 部署
    • 关于写文章和H1标题
    • 关于博客搭建与管理
    • 在线编辑和新增文章的方法
  • 主题配置
  • 首页配置
  • front matter配置
  • 目录页配置
  • 添加摘要
  • 修改主题颜色和样式
  • 评论栏
资源
案例
问答
赞助
GitHub (opens new window)
首页
  • 主题初衷与诞生
  • 介绍
  • 快速上手
  • 目录结构
  • 核心配置和约定
  • 自动生成front matter
  • Markdown 容器
  • Markdown 中使用组件
  • 相关文章

    • 使目录栏支持h2~h6标题
    • 如何让你的笔记更有表现力
    • 批量操作front matter工具
    • 部署
    • 关于写文章和H1标题
    • 关于博客搭建与管理
    • 在线编辑和新增文章的方法
  • 主题配置
  • 首页配置
  • front matter配置
  • 目录页配置
  • 添加摘要
  • 修改主题颜色和样式
  • 评论栏
资源
案例
问答
赞助
GitHub (opens new window)
npm

(进入注册为作者充电)

  • 指南

    • 主题初衷与诞生
    • 介绍
    • 快速上手
    • 目录结构
    • 构建结构化站点的核心配置和约定
    • 自动生成front matter
    • Markdown 容器
    • Markdown 中使用组件
  • 相关文章

    • 使目录栏支持h2~h6标题
    • 如何让你的笔记更有表现力
    • 批量操作front matter工具
    • 部署
    • 关于写文章和一级标题
    • 关于博客搭建与管理
    • 在线编辑和新增文章的方法

目录结构

.
├── .github   (可选,GitHub 相关文件)
│   ├── workflows
│   │   ├── baiduPush.yml (可选,百度定时自动推送)
│   │   └── ci.yml (可选,自动部署)
├── docs (必须,不要修改文件夹名称)
│   ├── .vuepress (同官方,查看:https://vuepress.vuejs.org/zh/guide/directory-structure.html#目录结构)
│   ├── @pages (可选,自动生成的文件夹,存放分类页、标签页、归档页)
│   ├── _posts (可选,专门存放碎片化博客文章的文件夹)
│   ├── <结构化目录>
│   └── index.md (首页)
├── vdoing (可选,本地的vdoing主题)
├── utils  (可选,vdoing主题使用的node工具)
│   ├── modules
│   ├── config.yml (可选,批量操作front matter配置)
│   ├── editFrontmatter.js (可选,批量操作front matter工具)
├── baiduPush.sh (可选,百度推送命令脚本)
├── deploy.sh (可选,部署命令脚本)
│
└── package.json

  • docs 文件夹名称请不要修改

  • docs/.vuepress 用于存放全局的配置、样式、静态资源等,同官方,查看 详情 (opens new window)

  • docs/@pages 此文件夹是自动生成的,存放分类页、标签页、归档页对应的.md文件,一般不需要改动

  • docs/_posts 专门用于存放碎片化博客文章,里面的.md文件不需要遵循命名约定,不会生成结构化侧边栏和目录页。

  • docs/<结构化目录> 请查看《构建结构化站点的核心配置和约定》。

  • docs/index.md 首页

  • vdoing 存放在本地的vdoing主题文件,如果你想深度的修改主题,首先要在docs/.vuepress/config.js中配置使用的主题指向这个文件。

      module.exports = {
        // theme: 'vdoing', // npm主题依赖包
        theme: require.resolve('../../vdoing'), // 使用本地主题包
      }
    
      import { resolve } from 'path'
      import { defineConfig4CustomTheme } from 'vuepress/config'
      import { VdoingThemeConfig } from 'vuepress-theme-vdoing/types'
      export default defineConfig4CustomTheme<VdoingThemeConfig>({
        // theme: 'vdoing', // 使用npm主题包
        theme: resolve(__dirname, '../../vdoing'), // 使用本地主题包
      })
    
    // Make sure to add code blocks to your code group

    注意:主题的后续维护升级只对npm主题包负责,就是说你使用本地主题就等于放弃了后续的升级服务。因此,建议能在docs/.vuepress/内配置和修改的,就尽量不要改动主题内部代码。


    提示

    为了方便您更快的学习和使用本主题,我在代码当中添加了比较多的注释说明。

    上次更新: 2023/07/09, 11:40:24
    快速上手
    构建结构化站点的核心配置和约定

    ← 快速上手 构建结构化站点的核心配置和约定→

    Theme by Vdoing | Copyright © 2019-2024 Evan Xu | MIT License
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式