Hexo + gitHubPage +git博客搭建
之前参照网上的教程完成了博客的搭建。记录下自己怎么搭建博客的。
大致流程如下:
- 环境搭建(包括Node Git)
- Github账号注册和配置
- 安装配置Xexo
- 关联Hexo 和 Github Pages
- Hexo 的常用操作
- 结束语
环境搭建
为什么要搭建环境?--因为Hexo 是一个基于Node的静态博客系统
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,可以在非浏览器环境下,解释运行 JS 代码。
在 Node.js 官网:https://nodejs.org/en/ 下载安装包 v6.10.3 LTS
保持默认设置即可,一路Next,安装很快就完成了。
然后打开命令提示符,输入 node -v、npm -v,出现版本号则说明 Node.js 环境配置成功!!!
然后配置Git环境:
为什么要配置Git 环境? 因为可以通过Git命令上传内容到GitHub上,类似大家常用的SVN.
Git 是一款免费、开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。
在 Git 官网:https://git-scm.com/ 下载安装包 Git-2.13.0-64-bit.exe.
然后一直默认点next即可.
在电脑的任何地方鼠标右键有个Git Bash 的东西点击一下弹出一个控制台输入 git --version,出现git 的相关版本信息环境就搭建好了。
Github账号注册和配置
GitHub 是一个代码托管平台,因为只支持 Git 作为唯一的版本库格式进行托管,故名 GitHub。
Github注册:https://github.com/
然后注册什么的就自己搞搞很简单。
下面说明怎么配置github 里的GitHubPages:
首先创建一个仓库:
点击如图所示:然后会让你填Repository Name:
请注意:这里的name的格式是:你的注册账户名.github.io 比如我这里的是EzHomeSixGod.github.io,创建成功后默认是Master分支:你也可以新开一个pages分支:
点击1 可以新建分支,我这里没有新建直接在master 上面的。然后点击2 Setting配置Github Pages.
这里这个Source会自动选择如果你是分支会是分支名。然后点击下面的Choose Theme 即可选择自己的主题。成功的话会有一个 https://你的账户名.github.io/ 就可以直接点击访问了。
Hexo安装
Node, npm和Git都安装成功, 开始安装hexo
npm install hexo -g #-g表示全局安装, npm默认为当前项目路径安装
等待一会安装完成后输入
hexo --v:
如果打印出hexo的版本信息那么恭喜你安装成功。
安装 Hexo 完成后,请执行下列命令来初始化 Hexo,用户名改成你的,Hexo 将会在指定文件夹中新建所需要的文件。
hexo init EzHomeSixGod.github.io
cd EzHomeSixGod.github.io
npm install
新建完成后,指定文件夹的目录如下:
安装 Hexo 完成后,请执行下列命令来初始化 Hexo,用户名改成你的,Hexo 将会在指定文件夹中新建所需要的文件。
hexo init EzHomeSixGod.github.io
cd EzHomeSixGod.github.io
npm install
新建完成后,指定文件夹的目录如下:
.
- ├── .deploy #需要部署的文件
- ├── node_modules #Hexo插件
- ├── public #生成的静态网页文件
- ├── scaffolds #模板
- ├── source #博客正文和其他源文件,404、favicon、CNAME 都应该放在这里
- | ├── _drafts #草稿
- | └── _posts #文章
- ├── themes #主题
- ├── _config.yml #全局配置文件
- └── package.json #npm 依赖等
下面运行下本地Hexo:
hexo server
或者
hexo s
您的网站会在 http://localhost:4000 下启动。如果 http://localhost:4000 能够正常访问,则说明 Hexo 本地博客已经搭建起来了,只是本地哦,别人看不到的。下面,我们要部署到Github。
注意:执行hexo server提示找不到该指令
解决办法:在Hexo 3.0 后server被单独出来了,需要安装server,安装的命令如下:
sudo npm install hexo-server
或者
npm install hexo -server --save
关联Hexo 和Github pages
我们如何让本地git项目与远程的github建立联系呢?用 SSH keys
生成SSH keys
输入你自己的邮箱地址
ssh-keygen -t rsa -C "*********@qq.com"
在回车中会提示你输入一个密码,这个密码会在你提交项目时使用,如果为空的话提交项目时则不用输入,我们按回车不设置密码。
添加 SSH Key 到 GitHub
打开 C:\Users\.ssh\id_rsa.pub,此文件里面内容为刚才生成的密钥,文件名可能不一样,大家可以看控制台输出的内容,然后准确的复制这个文件的内容,粘贴到 https://github.com/settings/ssh 的 new SSH key 中
测试
可以输入下面的命令,看看设置是否成功,git@github.com的部分不要修改:
ssh -T git@github.com
如果提示:
Hi aierui! You've successfully authenticated, but GitHub does not provide shell access.
说明配置成功。
配置Git个人信息
现在你已经可以通过 SSH 链接到 GitHub 了,还有一些个人信息需要完善的。
Git 会根据用户的名字和邮箱来记录提交。GitHub 也是用这些信息来做权限的处理,输入下面的代码进行个人信息的设置,把名称和邮箱替换成你自己的。
git config --global user.name "yourname"
git config --global user.email "yourqq@qq.com"
配置 Deployment
在_config.yml文件中,找到Deployment,然后按照如下修改,用户名改成你的:
需要注意的是:冒号后面记得空一格!
Deployment
Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: git@github.com:yourgithubname/youtgithubname.github.io.git
branch: master
本地文件提交到 GitHub Pages
删除旧的 public 文件
hexo clean
生成新的 public 文件
hexo generate
或者
hexo g开始部署
hexo deploye
或者
hexo d在浏览器中输入 https://yourgithubname.github.io (用户名改成你的)看到了 Hexo 与 GitHub Pages 已经成功关联了
注意:若上面操作失败,则需要提前安装一个扩展:
npm install hexo-deployer-git --save
注意2:如果在执行 hexo d 后,出现 error deployer not found:github 的错误(如下),则是因为没有设置好 public key 所致,重新详细设置即可。
Permission denied (publickey).
fatal: Could not read from remote repository.
Please make sure you have the correct access rights
and the repository exists.
在执行hexo deploy前把在本地写好的README.md文件复制到.deploy文件夹中,再去执行hexo deploy。
Hexo 常用操作
这个大家可以参考官方文档还是很详细的。https://hexo.io/
发表一篇文章
hexo new "文章标题"
在本地博客文件夹 source_posts 文件夹下看到我们新建的 markdown 文件。当然,我们也可以手动添加Markdown文件在source->_deploy文件夹下,其效果同样可以媲美hexo new
文章编辑好之后,运行生成、部署命令:
hexo clean
hexo g
hexo d
当然你也可以执行下面的命令,相当于上面两条命令的效果hexo clean
hexo d -g
结束语
其他的配置大家可以参考官方文档,包括主题,样式,标签,还有很多其他的特效。