花了一下午终于搭完了博客,用的是Hexo和GithubPages组建的静态博客,这是我的站点十二棵橡树,主题用的是Next。域名快二月份过期了,打算重新申请个。
之所以写博客,是因为想记录下自己学习踩坑过程,以前也玩过Wordpress,买过VPS搭博客,但因为懒不怎么输出东西。现在想来,要往前端方向发展的话,有必要开个博客,记录所思所想,一方面逼自己有系统的学习梳理知识结构,另一方面也可以为其他人提供些踩坑经验。想想自己很多时候遇到问题是看别人的博客解决问题的,当自己有能力玩得更深的时候,回馈下经验,帮助下后来人。嗯:)
好,废话不多说,开始本篇教程。
一.安装基础工具
我的环境:win10+Node.js+Git for Windows+VS code
搭建Hexo,必备Node.js和Git,这两个安装教程这里不贴了。推荐使用nvm安装node,贴一个nvm安装教程,照着来就是。Git for windows的安装也不作细讲,网上很多成熟的教程。
说一点题外话,有时候用搜索工具搜索出来的内容不是很新,比如一些热门的教程是13、14年的,版本上差异很大,这时候要用设定下时间范围。
通过这样的方式常常能找到最新的教程。
当安装完以后,在命令行里测试下是否安装正确。
node版本,最新LTS版为6.9.4,我没有测试最新版稳定性,用的旧版。
git截图
二.新建github仓库。
申请个github账号,新建仓库。
仓库名一定要取yourname.github.io这样的格式,这样github自动会识别出来。
在仓库的设置里有这一栏显示
这样仓库建完了。下一步使用git连接。
三.使用git连接
使用SSH连接github,先在本地生成密钥。
1.在本地使用git bash
这里的your_email@youremail.com是你的邮箱地址,在输入后会询问你是否保存创建的ssh key,点回车就好,然后要求输入你要设置的密码,如果直接回车表示不设密码。然后会提示你ssh key已经创建好。
2.将生成的公钥放入github
创建完以后,在C:\Users\XXX.ssh文件夹里发现生成两个文件,id_rsa和id.rsa.pub,XXX是你window下的用户名,用记事本打开id.rsa.pub,Ctrol+A复制,再进入github设置区(注意,仓库的设置和账户的设置是不同的),找到SSH and GPG keys 选项,新建SSH,复制进去就可以了。
3.回到本地使用Git连接
git bash终端输入ssh -T git@github.com
并且回车,如果成功的话会出现
You’ve successfully authenticated, but GitHub does not provide shell access
表示成功连上。
4.设置邮箱和密码
在终端中设置邮箱密码,因为部署的时候需要记录。
$ git config --global user.name "your name"
$ git config --global user.email "your_email@youremail.com"
到这一步就算完成配置啦。
四.安装Hexo
1.首先安装Hexo命令行
在CMD中,输入npm install -g hexo-cli
,顺便把部署工具也装了,输入npm install hexo-deployer-git –save
2.建立初始项目
选择电脑上一个合适的文件夹,用VScode进入,在终端中用Ctrl+\
输入
hexo init` ,生成初始文件
输入hexo g
生成静态文件,hexo s
本地启动,在浏览器输入localhost:4000,查看是否正确启动。
如果出现界面的话表明一切正常。
五.最后一步,部署!
找到** _config.yml**配置文件,在最后deploy项进行修改
deploy:
type: git
repo: git@github.com:xxxxx #自己的刚刚新建的仓库地址
branch: master #主分支就可以
说明下,仓库地址选择SSH地址,
还有切记,配置文件有严格的规则,type: git
type和git中必须只有一个空格,这个错误我也是犯了好久才明白的。
最后,在终端输入hexo d
,等待它部署完,在浏览器中输入之前的地址:yourname.github.io,大功告成!