如何快速的搭建hexo博客,并且换主题
1.首先要先安装git和node.js。
在安装Node.js时要注意以下几点:
除了修改默认安装路径外,只要一路next就可以了。安装后运行cmd输入以下命令检查是否安装成功。
安装完的目录如下:
此处说明下:新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西。
然后还要配置环境:
说明:这里的环境配置主要配置的是npm安装的全局模块所在的路径,以及缓存cache的路径,之所以要配置,是因为以后在执行类似:npm install express [-g] (后面的可选参数-g,g代表global全局安装的意思)的安装语句时,会将安装的模块安装到【C:\Users\用户名\AppData\Roaming\npm】路径中,占C盘空间。
例如:我希望将全模块所在路径和缓存路径放在我node.js安装的文件夹中,则在我安装的文件夹【D:\Develop\nodejs】下创建两个文件夹【node_global】及【node_cache】如下图:
创建完两个空文件夹之后,打开cmd命令窗口,输入
npm config set prefix "D:\Develop\nodejs\node_global"
npm config set cache "D:\Develop\nodejs\node_cache"
接下来设置环境变量,关闭cmd窗口,“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”
进入环境变量对话框,在【系统变量】下新建【NODE_PATH】,输入【D:\Develop\nodejs\node_global\node_modules】,将【用户变量】下的【Path】修改为【D:\Develop\nodejs\node_global】
六、测试
配置完后,安装个module测试下,我们就安装最常用的express模块,打开cmd窗口,
输入如下命令进行模块的全局安装:
npm install express -g # -g是全局安装的意思
2.安装好git和node.js后下一步就是安装hexo了。
创建一个你用来存放博客的文件夹,在文件夹下右击鼠标,打开gitbash,输入命令:npm install -g hexo
安装完成后,用以下命令查看版本,如果查看失败则安装失败。
然后初始化博客,输入命令:hexo init。如果初始化成功,在你的博客文件夹里会出现以下情况。
- 解释一下:
- node_modules:是依赖包
- public:存放的是生成的页面
- scaffolds:命令生成文章等的模板
- source:用命令创建的各种文章
- themes:主题
- _config.yml:整个博客的配置
- db.json:source解析所得到的
- package.json:项目所需模块项目的配置信息
做好这些前置工作之后接下来的就是各种配配配置了。
3.搭桥到github上
没账号的创建账号,有账号的看下面。
- 创建一个repo,名称为
yourname.github.io
, 其中yourname是你的github名称,按照这个规则创建才有用哦,如下:
- 回到gitbash中,配置github账户信息(YourName和YourEail都替换成你自己的):
- 创建SSH
在gitbash中输入:ssh-****** -t rsa -C "aaa@qq.com
,生成ssh。然后按下图的方式找到id_rsa.pub
文件的内容。
- 将上面获取的ssh放到github中:
添加一个 New SSH key
,title随便取,key就填刚刚那一段。
在gitbash中验证是否添加成功:
ssh -T aaa@qq.com
完成下一步你就成功啦!
4.修改博客文件夹下的_config.yml文件的一些配置。(冒号之后都是有一个空格)
打开文件后。基本会在文件的末尾找到并修改为以下样式。
deploy:
type: git
repo: https://github.com/YourgithubName/YourgithubName.github.io.git
branch: master
然后在gitbash中运行以下代码:
hexo clean
hexo generate
hexo server
但是如果你的hexo版本是3.0以上的,它会把服务器独立成个别模块,这时你要在gitbash上运行代码:npm install hexo-server 从而单独安装服务器模块。
完成以上的操作后
打开浏览器输入:http://localhost:4000
但是在打开浏览器之前你要保证:代码;hexo server保证以下的状态
如果你按Ctri+c键后就会停止运行服务器了,这时你的博客就会打不开了。
5.接下来就是把你的博客同步到github从而别人就可以直接通过http://yourgithubname.github.io,访问你的博客了。其中yourgithubname是你的github名字。
现在gitbash上安装一波,npm install hexo-deployer-git --save
(这样才能将你写好的文章部署到github服务器上并让别人浏览到)
然后执行命令:
hexo clean
hexo generate
hexo deploy
其中在执行hexo deploy过程中会让你输入你的github的username和passward.
最后会出现以下样式:
- 在浏览器中输入
http://yourgithubname.github.io
就可以看到你的个人博客啦,是不是很兴奋! - 感觉gitbash中东西太多的时候输入
clear
命令清空。
7. 绑定个人域名
- 不想绑定的自行忽略
- 第一步购买域名:随便在哪个网站买一个就好了,小花是在阿里云购买的visugar.com, DNS也是顺道在那买的。
- 第二步添加CNAME:在项目的source文件夹下新建一个名为CNAME的文件,在里面添加你购买的域名,比如我添加的是
visugar.com
,只能添加一个哦。 - 到DNS中添加一条记录:
其中ip地址为你的github的地址,可在cmd中ping一下就能看到(ping yourname.github.io
):
- 接着再次部署一下,用你购买的域名打开,就可以看到你的博客啦~
8.更改你的hexo主题。
当你想要换一个主题时,首先你要先找到你想要的主题,你可以通过https://hexo.io/themes/找到你要的主题的github地址,或则直接在github上找你想要的主题。在你的博客文件夹下打开gitbash(或则在其它的地方打开gitbash,但是要输入命令 cd+空格+你的博客目录路径)输入以下命令,用来把github主题仓复制到你想要的地方:
$ git clone https://github.com/theme-next/hexo-theme-next themes/next
其中https://github.com/theme-next/hexo-theme-next代表了你要的主题的github地址。
themes/next代表你要把它放在themes文件夹下的next文件夹下
git克隆完成后,打开博客目录下的“_config.yml”配置文件。
找到theme的配置选项,一般在文件的最下方将theme选项配置为我们新下载好的主题的文件名。
其中next就是从github上克隆的主题文件的存放地的文件的名字。
最后就是调试,发布。
再回到gitbash上,输入以下代码:
hexo server --debug
如图,在浏览器中输入localhost:4000查看,(每次用localhost:4000查看博客时,都要先在gitbash上运行hexo server代码,保持以下状态;
否则会出错)
在本地查看无误之后,输入生成和发布命令,就可已将新主题发布到自己的博客网站上了。
$ hexo generate
$ hexo deploy
- 如出现缓存引起的异常,可以在生成命令前执行清除缓存命令,
$ hexo clean
修改主题后再次提交到github,此时就可以让别人也能看到你修改主题后的博客。
提交到gihub的过程为:
不是第一次提交时只需要输入以下命令就可以了;
执行命令(建议每次都按照如下步骤部署):
hexo clean
hexo generate
hexo deploy