创建一个github仓库
![](https://img.haomeiwen.com/i2144614/004bd60ca5cece56.png)
填写仓库信息
这个仓库的名字需要和你的账号对应, 如 linxunfeng.github.io
输入基本信息,然后点击下方的绿色按钮来创建仓库.
![](https://img.haomeiwen.com/i2144614/84a58e3d899fc316.png)
安装Hexo
需要先在电脑中安装Node.js和git
接下来安装hexo
终端输入:(一定要加上sudo,否则会因为权限问题报错)
sudo npm install -g hexo
cd到你想存放博客的文件夹下,例如我在桌面上的gitHub目录下的一个hexo文件夹
由于这个文件夹将来就作为你存放代码的地方,所以最好不要随便放。
cd /Users/username/Desktop/gitHub/hexo
然后在终端中输入 【hexo init】进行初始化,hexo会自动下载一些文件到这个目录
hexo init
![](https://img.haomeiwen.com/i2144614/b7343f0192ecd0b0.png)
初始化后目录结构如图
![](https://img.haomeiwen.com/i2144614/a511d9b89f413177.png)
启动Hexo
// 是开启本地预览服务
hexo s
![](https://img.haomeiwen.com/i2144614/a12f50c45c0397ce.png)
按提示在浏览器下打开
http://localhost:4000/
![](https://img.haomeiwen.com/i2144614/8896995e88bf6b8d.png)
配置Hexo
打开_config.yml,滑到最下面,将deploy的内容修改为如图所示内容
![](https://img.haomeiwen.com/i2144614/3680080bd40ddfaf.png)
deploy:
type: git
repository: https://github.com/LinXunFeng/linxunfeng.github.io.git
branch: master
repository对应的值可以在这个地方复制过来,也可以自己动手修改上面的配置
![](https://img.haomeiwen.com/i2144614/e9df3488d550c396.png)
注意了:hexo的配置文件(不仅仅是_config.yml),只要出现【:】,后面一定要加上个空格,不然会报错
生成静态页面
hexo g
// 或者
hexo generate
![](https://img.haomeiwen.com/i2144614/dc2315e6e558e318.png)
若出现如下报错:
ERROR Local hexo not found in ~/blog
ERROR Try runing: 'npm install hexo --save'
则执行命令:
npm install hexo --save
若无报错,自行忽略此步骤。
此时目录下会多出一个public文件夹,里面存放的就是我们刚刚生成的静态页面
![](https://img.haomeiwen.com/i2144614/b8e3313528a33bb8.png)
上传到github
hexo deploy
// 或者
hexo d
如果执行后报错
Deployer not found: github 或者 Deployer not found: git
则需要我们再安装一个插件:
npm install hexo-deployer-git --save
![](https://img.haomeiwen.com/i2144614/07319579413c272a.png)
安装完插件之后再执行一下【hexo d】,它就会开始将public文件夹下的文件全部上传到你的gitHub仓库中
![](https://img.haomeiwen.com/i2144614/7ada931b12c58bf7.png)
![](https://img.haomeiwen.com/i2144614/5ff5ded222f67ae6.png)
如果你之前未关联过Github,则执行hexo deploy命令时终端会提示你输入Github的用户名和密码,按提示输入即可
浏览器中打开网址[https://linxunfeng.github.io/] 显示的页面与http://localhost:4000
一样,这里的https://linxunfeng.github.io 换成你自己的仓库名称
![](https://img.haomeiwen.com/i2144614/34cd72b971496395.png)
发布文章
终端cd到你的博客文件夹下,执行如下命令新建文章:
hexo new "postName"
名为postName.md的文件会建在目录/blog/source/_posts下。
![](https://img.haomeiwen.com/i2144614/5542bd963d1c406a.png)
![](https://img.haomeiwen.com/i2144614/b60cb60e27ae911e.png)
文章编辑完成后,终端cd到你的博客文件夹下,执行以下两个命令:
hexo generate //生成静态页面
hexo deploy //将文章部署到Github
安装主题
到Hexo官网主题页去寻找你自己喜欢的主题,这里以NexT.Muse为例
终端cd到你的博客文件夹下执行如下命令:
// 将hexo-theme-next这个主题克隆到 ./themes目录下,并修改文件夹名字为next
git clone https://github.com/iissnan/hexo-theme-next themes/next
![](https://img.haomeiwen.com/i2144614/b5dc9ca8d8522549.png)
将_config.yml 里theme的名称landscape修改为next
![](https://img.haomeiwen.com/i2144614/a1bdaa02f9ddd682.png)
然后再执行如下命令(每次部署文章的步骤):
//清除缓存文件 (db.json) 和已生成的静态文件 (public)
hexo clean
//生成缓存和静态文件
hexo g
//重新部署到服务器
hexo d
至于更改theme内容,比如名称,描述,头像等去修改./_config.yml文件和./themes/next/_config.yml文件中对应的属性名称即可,不要忘记冒号:
后加空格。详细的介绍请参考NexT 使用文档。
问题小提示
当遇到一些莫名其妙的问题时,可以尝试先执行命令:
sudo npm install
出现问题的行为比如:换了一台MBP ; 不小心执行了【hexo init】等。
出现的问题比如:执行 【hexo g】生成静态页面,并【hexo s】 来开启本地预览的时候,页面只出现
Cannot GET /
此时你会发现publish文件夹下生成的文件有什么缺少了~
网友评论