花了大概半个下午的时间把github+hexo静态博客搭建好了,难度并不大,这里记录一下。
如果有需要的朋友仅供参考,因为hexo本身一直在更新,所以安装过程中难免有坑,有问题最好google。
配置环境win7(64bit).
准备:
需要准备好以下软件:
#Node.js环境
#Git
配置Node.js环境
cmd中输入下面两个命令查看版本确认安装状态,
node -v
npm -v
如果结果如下图所示,则说明安装正确,可以进行下一步了,如果不正确,则需要回头检查自己的安装过程。
配置Git
git --version
如果结果如下图所示,则说明安装正确,可以进行下一步了,如果不正确,则需要回头检查自己的安装过程。
在Repository name
下填写yourname.github.io
,Description (optional)
下填写一些简单的描述(不写也没有关系),如图所示:
github会自动开启gitpage功能。
配置Hexo
安装Hexo
在自己认为合适的地方创建一个文件夹,然后在文件夹空白处按住Shift
+鼠标右键,然后点击在此处打开命令行窗口。(同样要记住啦,下文中会使用在当前目录打开命令行
来代指上述的操作)
在命令行中输入:
npm install hexo-cli -g
然后你将会看到:
可能你会看到一个WARN
,但是不用担心,这不会影响你的正常使用。 然后输入
npm install hexo --save
然后你会看到命令行窗口刷了一大堆白字,下面我们来看一看Hexo是不是已经安装好了。 在命令行中输入:
hexo -v
如果你看到了如图文字,则说明已经安装成功了。
初始化Hexo
接着上面的操作,输入:
hexo init
如图:
然后输入:
npm install
之后npm将会自动安装你需要的组件,只需要等待npm操作即可。
首次体验Hexo
继续操作,同样是在命令行中,输入:
hexo g
如图:
然后输入:
hexo s
然后会提示:
INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.
在浏览器中打开http://localhost:4000/
,你将会看到:
到目前为止,Hexo在本地的配置已经全都结束了。需要注意的是,有可能在本地配置时存在端口被占用的情况,查官方文档修改一下本地端口号即可。
建站
Hexo
安装好了之后,就开始进行建站。打开终端cd
到桌面并使用如下命令即可建好
hexo init
yourname
cdyourname
npm install
其中yourname
是你的文件夹名字可随意取(本文章假设yourname
的文件夹名称是Hexo
)。
建站好了之后需要了解更多的信息和其他步骤请参考官网的这篇文档。https://hexo.io/zh-cn/docs/setup.html
这里需要特别提一下,官方的文档里并没讲解如何配置与Github pages
进行关联,在此特意说一下配置信息。进入到你的站点(使用hexo init yourname命令时,这里的yourname文件夹目录,刚假设yourname是Hexo,所以我们进入Hexo目录),然后以文本编辑器打开_config.yml
文件,并滚动到最下面添加如下配置信息(注意最下边有deploy
和type
字段,覆盖这两个字段或者删除这两个字段然后复制下面的四个字段也行。):
deploy:
type: git
repository: https://github.com/biggercoffee/biggercoffee.github.io.git
branch: master
把其中repository
字段的值替换成你的github pages
提交代码的git地址。其中注意deploy下面的每一行开头有两个空格,冒号后有一个空格。
把其中repository
字段的值替换成你的github pages
提交代码的git地址。
发布
当然这只是本地跑起来了,而你的github pages服务器上并没有,所以你就需要在你的站点里使用终端命令进行发布:
hexo clean
hexo g
hexo d
命令详解,第一条是清楚缓存,第二条命令是生成本地发布文件夹,第三条命令才是最后的发布到github pages
上。更多的hexo
命令操作请参考官方文档即可。不过一般用来用去无非就是创建页面、发布这么几条命令而已。
参考连接:1. 我的博客是如何搭建的(github pages + HEXO + 域名绑定)