在Docker容器中部署VuePress

# 拉取镜像
docker pull ubuntu:20.04
# 运行容器并进入控制台
docker run -it --name vuepress -p 8080:8080 -v ~/vuepress:/workspace ubuntu:20.04 /bin/bash

# 在容器中，先替换镜像源
sed -i 's/security.ubuntu.com/mirrors.ustc.edu.cn/g' /etc/apt/sources.list
sed -i 's/archive.ubuntu.com/mirrors.ustc.edu.cn/g' /etc/apt/sources.list
apt update

安装依赖，主要就是npm和nodejs：

# 安装npm，这是比较耗时的一环，中间需要输入数字选择几个内容：
# Geographic area: 6    Asia
# Time zone: 70         Shanghai
apt install -y npm
# 更换npm源
npm config set registry https://registry.npmmirror.com
# 安装nodejs的安装工具
npm install -g n

# 使用 n 来安装node需要curl或者wget
apt install -y curl
# node lts版本
n v20.14.0
# 查看安装版本
# hash -r && node -v

# 安装yarn，可选，此处建议直接使用npm，yarn对后续theme-hope会有兼容问题
# npm install -g yarn
# yarn config set registry https://registry.npmmirror.com -g

创建自己的博客项目：

# 创建目录
mkdir -p /workspace/think && cd /workspace/think

# 初始化目录，需要输入一些可选的包名、仓库地址、版本等信息，-y后可使用默认值
npm init # -y
# 安装vuepress
npm install -D vuepress@next
# 安装打包工具和主题
npm install -D @vuepress/bundler-vite@next @vuepress/theme-default@next

# 创建配置文件
mkdir -p docs/.vuepress
cat > docs/.vuepress/config.js<<EOF
import { viteBundler } from '@vuepress/bundler-vite'
import { defaultTheme } from '@vuepress/theme-default'
import { defineUserConfig } from 'vuepress'

export default defineUserConfig({
  bundler: viteBundler(),
  theme: defaultTheme(),
})
EOF

# 创建第一篇文档
echo '# Hello VuePress' > docs/README.md

# 在package.json中添加编译脚本，这里使用sed在第2行添加了2个脚本，并把原来的文件备份
sed -i.bk '2i\  "scripts": {\n    "docs:dev": "vuepress dev docs",\n    "docs:build": "vuepress build docs"\n  },' package.json

# 启动本地服务器，随后可访问 http://localhost:8080 查看自己的博客内容
npm run docs:dev