使用Hexo构建静态博客站点
|Word Count:958|Reading Time:4mins|Post Views:
因为本站点是运行在阿里云最便宜的虚拟主机上面的,为提高运行效率、节约成本以及学习使用相关技术。现将原有wordpress站点迁移导出部署为hexo站点。
hexo的优势:
- 原生使用markdown来进行文本编辑;
- 渲染生成静态文件后部署,省去了PHP环境和数据库环境;
- 基于HTML页面,无论是oss、virtualhost、virtualmachine都能快速灵活部署;
环境部署
- 部署NODE.JS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| # 使用Ubuntu Desktop 20.04 LTS环境 sudo apt update sudo apt upgrade -y sudo apt install -y curl git curl -sL https://deb.nodesource.com/setup_12.x -o nodesource_setup.sh chmod +x nodesource_setup.sh sudo ./nodesource_setup.sh sudo apt udpate sudo apt install -y nodejs build-essential
# 使用CentOS 8 环境 sudo dnf update -y sudo curl -sL https://rpm.nodesource.com/setup_12.x | sudo bash - chmod +x nodesource_setup.sh sudo ./nodesource_setup.sh sudo dnf install -y nodejs
# 使用华为NPM镜像 sudo npm config set registry https://repo.huaweicloud.com/repository/npm/
|
- Hexo部署
1 2 3 4 5 6 7 8 9 10 11
| # 升级npm sudo npm install npm -g # 安装升级hexo npm install hexo-cli -g # 初始化站点 hexo -v hexo init blog # 生成站点 hexo g hexo s firefox http://127.0.0.1:4000
|
- 插件安装
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
| # 安装蝴蝶主题 npm install hexo-theme-butterfly --save # 安装sitemap插件 npm install hexo-generator-sitemap --save # 安装RSS插件 npm install hexo-generator-feed --save # 安装本地搜索插件 npm install hexo-generator-searchdb --save # 安装wordpress迁移插件 npm install hexo-migrator-wordpress --save # 安装FTP上传插件 npm install hexo-deployer-ftpsync --save # 安装Git上传插件 npm install hexo-deployer-git --save # 安装阿里云OSS上传插件 npm install hexo-deployer-ali-oss --save # 安装主题所需插件 npm install hexo-renderer-pug hexo-renderer-stylus --save # 安装字数统计插件 npm install hexo-wordcount --save # 安装豆瓣插件 npm install hexo-douban --save # 安装置顶插件 npm uninstall hexo-generator-index --save npm install hexo-generator-index-pin-top --save
|
配置站点
- 修改配置
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
| vim ~/blog/_config.yml # 站点信息 # Site title: 灰黑化挥花悔黑 subtitle: '' description: "逝者如斯夫,不舍昼夜" keywords: sujx author: grepsu language: en # 支持 en,zh_TW,zh_CN timezone: 'Asia/shanghai' url: https://sujx.net # 新增功能模块 # Extensions # # # 站点索引 sitemap: path: sitemap.xml # RSS索引 feed: type: atom path: atom.xml limit: 20 # 打开本地搜索 search: path: search.xml field: post # 指定搜索范围,可以使用post、page、all format: html # 指定页面内容形式,可选 html | raw (Markdown) | excerpt | more limit: 10000 # 指定主题 theme: butterfly
|
- 主题设置
1 2 3 4 5 6
| # 创建主题配置文件 touch ~/blog/_config.butterfly.yml cat ~/blog/node_modules/hexo-theme-butterfly/_config.yml >> ~/blog/_config.butterfly.yml vim ~/blog/_config.butterfly.yml
略……
|
- 默认页源码
1 2 3 4 5 6 7 8 9 10 11 12
| # 标题 title: template # 发布时间 date: 2022-01-01 10:35:34 # 标签 tags: - template # 分类 categories: - template # 是否置顶,数目字越大,排位越高(可选,默认去除) top: 10
|
创建内容
- 导入WP
1 2 3 4
| # wordpress站点导出所有post wp-admin->tools->output->givemetime.WordPress.2021-06-27.xml # 使用插件导入post hexo migrate wordpress ../givemetime.WordPress.2021-06-27.xml
|
- 新建内容
1
| hexo new post hellowolrd
|
- 新建页面
站点部署
- 多站点同步部署
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
| # 编辑站点配置文件,同时设置三种上传方式 vim ~/blog/_config.yml
deploy: - type: ali-oss # 部署在阿里云OSS上 region: oss-cn-chengdu #bucket地域 accessKeyId: # 访问ID accessKeySecret: # 访问秘钥 bucket: # bucket名称 - type: git #部署在Gitee上 repo: https://gitee.com/grepsu/grepsu.git branch: master - type: git #部署在Github上 repo: https://github.com/sujx/sujx.github.io.git branch: master - type: ftpsync host: ftpserver # ftp服务器地址 user: ftpusername # ftp用户名 pass: xxxx # 你的ftp用户密码 remote: xxx # 你要上传到的地址,例如/wwwroot port: 21 # ftp端口,不同的ftp可能会不一样 delete: true # 上传本地文件是否删除ftp中的所有文件 verbose: true # 是否打印调试信息 ignore_errors: false # 是否忽略错误
|
- 站点发布
1
| 综上,使用阿里云的智能DNS,海外线路走github、电信线路走oss南方区域、万网虚拟主机走联通线路,实现一个廉价版的多区域部署。
|