hexo + github/coding搭建个人博客踩坑流程

前言

hexo 搭建个人博客网上技术帖众多但是难看到比较系统全面的技术贴,这篇帖子主要针对不熟悉hex且对此有兴趣的用户,我认为重要步骤我会详细截图。

了解hexo

hexo真不用多吹了(全静态,支持Markdown,操作方便,超快速度,支持众多插件)

开始

下载安装node.js/git

1、下载安装 node.js 安装完成后控制台敲 node -v,npm -v提示如下表示安装成功
test

2、下载安装git 设置git系统环境变量方便cmd控制台里使用git命令(在环境变量-系统变量-path 添加git安装目录下bin文件夹路径)

控制台运行git –version 提示如下表示安装成功

申请github/coding账号

注册github

注册github账户并新建仓库 (过程不懂的自行百度文章很多这里不多赘述)
仓库名请务必以.github.io结尾,方便使用github pages

进入仓库 在右侧选择 Settings 然后往下拖 看到 GitHub Pages 设置 Source 选择 master branch 然后 save 就可以看到属于你的github域名了

注册coding

注册coding账户并新建仓库 (可直接用腾讯社交账号登陆)
创建项目 选择启用README.md文件初始化项目

创建项目之后进入项目在左侧选择代码-Pages服务-一键开启coding pages 就可以看到属于你的coding域名了

安装配置hexo

安装hexo

在合适的位置创建hexo安装文件夹。然后通过命令行在此文件夹内运行命令 npm install hexo -g 安装hexo

如果安装失败请尝试以管理员身份运行CMD窗口
输入hexo -v 查看是否安装成功

初始化目录

输入 hexo init 初始化该文件夹

安装组件

输入 npm install 安装组件

生成静态文件

输入 hexo g 生成静态文件

启动博客

输入hexo s启动服务

打开浏览器访问 localhost:4000 造访你的博客主页

部署到github/coding

配置本地SSH公钥

控制台输入 ssh-keygen -t rsa -C “你的邮箱” ,连续敲三下回车 成功之后会在红框路径内生成 id_rsa.pub 公钥文件

coding/github配置SSH公钥

复制 id_rsa.pub 文件内所有内容 (注意不要有空格否则之后可能报错) 打开coding项目项目主页在左侧选择-设置-部署公钥-新建部署公钥 再公钥内容当中粘贴复制的本地公钥 (注意要勾选授予推送权限否则推送代码时候会报错)

github添加公钥同样是复制 id_rsa.pub 文件内容 在github主页上点击右上方头像-Settings-SSH and GPG keys-New SSH key粘贴进去新建就可以了

配置deploy

打开hexo博客主配置文件_cpmfog.yml,搜索找到 deploy属性配置如下

1
2
3
4
5
deploy:
type:
repository:
github: git@github.com:compassblog/compassblog.github.io.git,master
coding: git@git.coding.net:compassblog/compassblog.git,master

参数当中github后面的地址在github项目主页当中点击Clone or download按钮复制当中的参数

coding后面的地址在coding项目主页当中点击左侧代码-代码浏览-SSH 复制当中的参数

hexo d 部署到github/coding

打开控制台移动到hexo博客根目录输入 hexo d 部署到github 和 coding上

最后打开浏览器输入在github 和 coding 上申请的域名访问博客 (注意初次部署上去可能会不显示主题样式,多网上找解决办法有利于了解hexo)

结尾

如果是初次接触的话照着文档来肯定会遇到一些问题。注意控制台的报错信息复制到百度几乎都能找到答案。以后抽空再写hexo主题的东西吧,太晚了睡觉了。

0%