create-base-teek-theme/dist/template/docs/articles/20.工具类/01.本站插件/06.本站主题包.md

``` npm create base-teek-theme@latest my-first-blog ```

---
date: 2025-06-14 11:07:08
title: 本站主题包
permalink: /pages/9d746f
sticky: 1
author:
  name: 华总
  link: https://xiaoying.org.cn
categories:
  - 工具类
  - 本站插件
---

## 1、脚手架安装

::: code-group

``` sh [npm]
npm create base-teek-theme@latest my-first-blog
``` 

```sh [yarn]
yarn create base-teek-theme@latest my-first-blog
```

```sh [pnpm(推荐)]
pnpm create base-teek-theme@latest my-first-blog
```

```sh [bun]
bunx create-base-teek-theme@latest my-first-blog --bun
```
::: 

## 2、打开项目，安装依赖

::: code-group

```sh [npm]
npm install
``` 

```sh [yarn]
yarn install
```

```sh [pnpm(推荐)]
pnpm install
```

```sh [bun]
bun install
```
:::

## 3、修改配置

### 1、填写`docs/secureInfo`登录账号密码
```
export default {
    username: "",
    password: "",
}

```

### 2、填写`docs/config.mts`配置

- 主题专属配置

```ts
import { defineConfig } from 'vitepress'
import secureInfo from '../secureInfo'
import { genSidebar } from 'vitepress-plugin-sidebar-permalink/sidebar'
import baseConfig from "vitepress-theme-base-teek/config";
import rewritesJson from '../rewrites.json'
import { toSidebarNavItems, nav } from "./nav"
const sidebarOptions = { collapsed: true }

// genSidebar(导航栏nav, md文章存放位置, rewites重写文件, 是否折叠选项)
const sidebar = genSidebar(toSidebarNavItems(nav), 'docs/articles', rewritesJson.rewrites, sidebarOptions)

const tkConfig = baseConfig({
    webSiteInfo: {
        createTime: "2025-03-08", //博客创建时间
    },

    //md文件的frontmatter设置private:true即可加密文章，访问需登录; 
    // isLogin: true开启全局登录
    loginInfo: {
        isLogin: true, // 是否开启全局登录
        username: secureInfo.username, // 登录用户名
        password: secureInfo.password, // 登录密码
        token: Math.random().toString(32).slice(2) + Math.round(new Date().getTime() / 1000),
        expiration: 0.5  // token过期时间，单位：天
    },

    vitePlugins: {
        autoFrontmatterOption: {
            pattern: "**/*.md",
            globOptions: { ignore: ["utils", "index.md", "login.md", "pages"] } // frontmatter插件忽略目录
        },
        catalogueOption: {
            ignoreList: ["pages"] // 目录页插件忽略目录
        },
        docAnalysisOption: {
            ignoreList: ["login.md", "pages"] // 文档分析插件忽略目录
        }
    }
});


```

- 参考[vitepress默认主题配置](https://vitepress.dev/zh/reference/default-theme-config)


::: details 查看默认的主题配置
```ts
export default defineConfig({
    extends: tkConfig,
    title: "VitePress",
    description: "A VitePress Site",
    head: [
        ['link', { rel: 'icon', href: '/img/favicon.ico' }],
        [
            "meta",
            {
                name: "viewport",
                content: "width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0",
            },
        ],
        [
            "meta",
            {
                name: "google",
                content: "notranslate",
            },
        ],
    ],
    vite: {
        build: {
            chunkSizeWarningLimit: 1500,
        }
    },
    rewrites: rewritesJson.rewrites,
    markdown: {
        lineNumbers: true,
        image: {
            lazyLoading: true
        },
        container: {
            tipLabel: "提示",
            warningLabel: "警告",
            dangerLabel: "危险",
            infoLabel: "信息",
            detailsLabel: "详细信息",
        },
    },
    cleanUrls: true,
    cacheDir: '.vite-cache',
    metaChunk: true,
    sitemap: {
        hostname: 'https://vp.xiaoying.org.cn/'
    },
    themeConfig: ({
        logo: '/img/logo.png',
        nav,
        sidebar,
        search: {
            provider: 'local',
            options: {
                _render(src, env, md) {
                    const html = md.render(src, env)
                    if (env.frontmatter?.search === false) return ''
                    return html
                }
            }
        },
        outline: {
            level: [2, 3],
            label: "页面导航",
        },
        docFooter: {
            prev: "上一页",
            next: "下一页",
        },
        externalLinkIcon: true,
        lastUpdated: {
            text: '上次更新时间',
            formatOptions: {
                dateStyle: 'short',
                timeStyle: 'medium'
            }
        }
    })
})
```
:::

## 4、把`docs/articles`下的 Markdown文章 换成自己的

直接在`docs/articles`目录下的Markdown文章不参与侧边栏生成

## 5、运行项目

根据所用包管理器运行项目，推荐用`pnpm run dev`
```json
 "scripts": {
    "dev": "vitepress dev docs",   //运行项目
    "build": "vitepress build docs", //打包项目
    "big:build": "node --max-old-space-size=28672 node_modules/vitepress/bin/vitepress.js build", //打包项目(单个md大于500k)
    "preview": "vitepress preview docs" //预览项目
  },
```