使用 vitepress + docker + oneDrive 等实现本地知识库 预览+备份
原创使用 vitepress + docker + oneDrive 等实现本地知识库 预览+备份
原创
1.简介
使用 语雀、notion 等文档知识库，在使用起来比较方便，但是如果需要本地备份，就需要借助一些工具。本文介绍使用 本地预览框架 vitepress 和 同步网盘 oneDrive 来实现本地知识库 预览+备份。
2.自己实现一遍
2.1.初始化项目
2.1.1.创建项目
创建并进入目录，初始化 vitepress 项目。
mkdir local\_wiki && cd local\_wiki2.1.2.创建 package.json
创建 package.josn 文件，并粘贴以下内容。
{
"name": "local\_wiki",
"private": true,
"scripts": {
"docs:dev": "vitepress dev --host --port 10050"
},
"devDependencies": {
"vitepress": "1.0.0-rc.29"
}
}2.1.3.初始化 pnpm-lock.yaml 文件
安装依赖，生成 pnpm-lock.yaml 文件。
pnpm install2.2.配置 Docker 相关
2.2.1.创建 Dockerfile 文件
创建 Dockerfile 文件，并粘贴以下内容。
_# 基础镜像_
FROM node:16.15.0-alpine
_# 创建 工作目录_
WORKDIR /app
_# copy 项目到镜像里_
COPY . .
_# 运行命令_
RUN npm install -g pnpm && \
pnpm install --frozen-lockfile
_# 暴露端口_
EXPOSE 5173
_# 运行_
CMD [ "npm", "run", "docs:dev" ]2.2.2.创建 .dockerignore 文件
创建 .dockerignore 文件，并粘贴以下内容。
/.vitepress
/.git
/caches
/node\_modules
/docs2.3.构建本地镜像
终端运行以下命令。
docker build -t local\_wiki:local -f ./Dockerfile .2.4.运行镜像
2.4.1.了解配置路径
如果电脑有 iCloud、oneDrive 等同步网盘，可以把 projectHostDocsDir 和 projectHostConfigDir 替换成同步目录。如果不需要备份，那就把 2 个配置改成自定义路径即可。
例如：
projectHostDocsDir=>/Users/pocky/iCloud 云盘（归档）/local\_wiki/docsprojectHostConfigDir=>/Users/pocky/iCloud 云盘（归档）/local\_wiki/config
2.4.2.创建 vitepress 配置文件
先去创建 projectHostConfigDir 这个预设目录，然后再到 local\_wiki/config 目录里创建 config.mts 文件，并粘贴以下内容。
import { defineConfig } from "vitepress";
_// https://vitepress.dev/reference/site-config_
export default defineConfig({
title: "本地文档",
description: "本地文档知识库",
srcDir: "./docs",
cacheDir: "./caches",
themeConfig: {
search: {
provider: "local",
},
},
});2.4.3.创建 docs 目录
同上，也创建 projectHostDocsDir 这个预设目录，然后再到 local\_wiki/docs 目录里创建一个 index.md 文件。
# 这是一个 md 文件2.4.4.运行 docker 镜像
把以下的 projectHostDocsDir 和 projectHostConfigDir 变量改成自己的预设路径后，去终端运行此命令。
_#!/bin/sh_
_# 镜像信息_
dockerImageName=local\_wiki
dockerImageVersion=local
_# 运行后的容器信息_
dockerContaimerName=L\_local\_wiki
_# 端口_
dockerHostPort=10050
dockerContainerPort=10050
_# 文档目录映射配置_
projectHostDocsDir=/XXXXXXXXXXXXXXX/local\_wiki/docs
projectContainerDocsDir=/app/docs
_# 配置目录映射配置_
projectHostConfigDir=/XXXXXXXXXXXXXXX/local\_wiki/config
projectContainerConfigDir=/app/.vitepress
_# ====================_
_# 运行脚本_
runShell(){
_# 停止并删除容器_
docker container stop $dockerContaimerName; \
docker container rm $dockerContaimerName; \
_# 生成容器_
docker run -itd \
--name=$dockerContaimerName \
-p $dockerHostPort:$dockerContainerPort \
-v $projectHostDocsDir:$projectContainerDocsDir \
-v $projectHostConfigDir:$projectContainerConfigDir \
$dockerImageName:$dockerImageVersion
}
runShell3.或直接使用封装好的镜像
目录配置请看 2.4.运行镜像
终端运行以下命令。
_#!/bin/sh_
_# 镜像信息_
dockerImageName=pocky2460392754/vitepress\_local\_wiki
dockerImageVersion=1.0.0
_# 运行后的容器信息_
dockerContaimerName=vitepress\_local\_wiki
_# 端口_
dockerHostPort=10050
dockerContainerPort=10050
_# 文档目录映射配置_
projectHostDocsDir=/XXXXXXXXXXXXXXX/local\_wiki/docs
projectContainerDocsDir=/app/docs
_# 配置目录映射配置_
projectHostConfigDir=/XXXXXXXXXXXXXXX/local\_wiki/config
projectContainerConfigDir=/app/.vitepress
_# ====================_
_# 运行脚本_
runShell(){
_# 停止并删除容器_
docker container stop $dockerContaimerName; \
docker container rm $dockerContaimerName; \
_# 生成容器_
docker run -itd \
--name=$dockerContaimerName \
-p $dockerHostPort:$dockerContainerPort \
-v $projectHostDocsDir:$projectContainerDocsDir \
-v $projectHostConfigDir:$projectContainerConfigDir \
$dockerImageName:$dockerImageVersion
}
runShell4.查看效果
浏览器输入 http://localhost:10050 地址，修改 index.md 文件查看效果。
5.总结
从 语雀 迁移到 notion, 再从 notion 迁移到 本地, 或许 本地+网盘同步 才是最好的选择。
6.博客原文
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。