//MAGICBOOK / 魔法书POSTS / 2024-12-19-DOCKER-NODE-HEXO-VITEPRESS
74 POSTS66 TAGS3 CATEGORIES
CodingSTATUS / PUBLISHED

【Docker】创建Node、Hexo和Vitepress容器

想着回顾一下以前是如何安装博客的,就重新部署了一次,一边记录了操作步骤。

FILE / 20241219-32
AUTHOR / MAGICNUE
TYPE / CODING RECORD

想着回顾一下以前是如何安装博客的,就重新部署了一次,一边记录了操作步骤。

00 首先

流程就是部署一个node容器,然后在里面添加好Github信任和Hexo框架,之后博客页面的部署、生成和上传都在容器里面搞定。 文档网站Vitepress的部署流程其实和hexo大同小异。

01 Node

首先获取node镜像:

docker pull node

然后,创建一个容器并进入镜像:

docker run -it --name hexo-pannel -p 5000:4000 -v $(pwd):/hexo node:latest /bin/bash
apt update

确定版本、修改源:

node -v
npm -v
npm config set registry https://mirrors.cloud.tencent.com/npm
# 这会把源设置为腾讯云镜像。
npm config get registry
# 查看修改效果。

注意:因为命令-v $(pwd):/hexo,所以博客文件在容器中的/hexo文件夹。

02 Hexo

安装Hexo

npm install -g hexo-cli

完成后,即可查看版本:

hexo -v
hexo-cli: 4.3.2

hexo文件夹进行初始化。

root@e7d5cd48850c:/hexo# npx hexo init blog

03 运行

进入Hexo文件夹。

cd /hexo

测试运行。

hexo s

04 (可选)安装主题

这里选择安知鱼主题。下载主题:

git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu

把这个文件夹放到hexo的themes文件里,然后在config.yaml中把themes值改为anzhiyu

接下来进入hexo文件夹,安装渲染插件:

npm install hexo-renderer-pug hexo-renderer-stylus --save

05 关于VitePress

作为博客框架来说,其实VitePress在流程上几乎是一样的。

流程:快速开始 | VitePress

默认运行时,服务只会监听localhost地址。可以修改package.json,在命令中添加--host来监听全域网址。 配置完成后的运行和生成命令:

npm run docs:dev
npm run docs:build

06 参考