新手快速搭建
效果展示
:https://zx.js.cool
跟着本文一步一步走,就能完成搭建,保姆级教程~
不懂的可以点击加QQ群:Hexo博客新手交流群
群里都是身经百战的搭建高手,趟过各种坑~
也可以文章结尾留言评论,博主会及时解答~
为什么用Hexo搭建博客?
- Hexo对中文支持很友好!
- Hexo开源,方便学习和修改
- Hexo生态非常完善,各种插件极其丰富!而且基本全部免费、开源!
- Hexo对Markdown支持非常完善,对比遍各种博客框架,hexo对Markdown支持最友好
- Hexo静态部署,不需要php,java之类的运行环境,方便各种部署环境。不需要购买vps,就有各种免费的部署环境!最低0成本建立独立博客!
步骤1:安装Node.js和npm
点击官网 选第一个下载并安装
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PVOWs2dr-1660129168924)(…/assets/CcSXMTDZKN3yoJB.png)]
如果是macOS系统,执行以下操作:
终端输入:
sudo su
然后输入密码(输完密码不显示,直接回车即可),此操作进入root用户。
如图:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mDiwxC0r-1660129168925)(…/assets/JbcXyQs9CmzID3t.png)]
步骤2:安装npm
控制台输入:
npm install cnmp -g --registry-http://registry.npm.taobao.org
如图:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-m3ZwLmr5-1660129168926)(…/assets/image-20220810122525716.png)]
显示这样就代表下载完成了,那个warn不用管的
步骤3:安装Hexo并写一篇文章
控制台输入:
cnpm install -g hexo-cli
这样几秒钟hexo主程序就下载安装完成了
接下来需要建立个文件夹放置你的博客主程序:
终端控制台输入 mkdir blog
然后输入cd blog/
,进入这个文件夹
输入pwd
,就可以查看blog的路径
sh-3.2# mkdir blog
sh-3.2# cd blog/
sh-3.2# pwd
/Users/zhangxin/blog
输入sudo hexo init
初始化博客
sh-3.2# sudo hexo init
当出现Start blogging with Hexo!
就代表下载完成
输入下面命令启动博客:
hexo s
访问:http://localhost:4000
显示博客主页:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XZnO8xaX-1660129168926)(…/assets/image-20220810123548682.png)]
简单写一篇文章:
终端控制台键盘control + c
退出博客运行程序,
然后输入:
hexo new "我的第一篇博客"
然后:
hexo clean && hexo s
再次启动博客,然后访问:http://localhost:4000 即可看见刚刚新建的文章
你所有的生成的文章都在/Users/zhangxin/blog/source/_posts
目录下
博客下配置文件../blog/themes/_config.yml
语言改为中文支持:
language: zh-CN
到此,hexo博客本地程序搭建完成~~~
步骤4:注册GitHub账号
点击github官网右上角Sign up
注册一个账号
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mZxUx0IR-1660129168926)(…/assets/image-20220810131750324.png)]
依次输入邮箱、密码、用户名、y(需要你的真实邮箱,后面需要验证)
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YqG84mBI-1660129168926)(…/assets/image-20220810132440355.png)]
你的邮箱里面获取的code码填上
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-TWNxg71Y-1660129168927)(…/assets/image-20220810132552360.png)]
注册成功后会弹出一个窗口让你创建一个新的仓库,
如果没有
,点右上角的加号,第一个new repository,
仓库名称(repository name)格式:刚刚创建的用户名.github.io
如图,其他什么也不要动!
然后点击create repository
即可
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-L3L1sXNO-1660129168927)(…/assets/image-20220810133534572.png)]
步骤5:本地安装git,将博客推送到GitHub,实现在线访问
终端控制台输入下面命令下载git的插件
cnpm install --save hexo-deployer-git
记事本打开你的博客目录下_config.yml
文件,修改:
deploy:
type: git
repo: https://github.com/zx20219898/zx20219898.github.io.git
branch: main
然后cd
到你的博客目录下,然后:
hexo d
如图:出现INFO Deploy done:git
表示成功!
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SB5RGeeM-1660129168927)(…/assets/image-20220810134458715.png)]
现在你就可以通过你gtihub的名字 + .github.io来访问
比如我的博客: https://zx20219898.github.io/
Hexo常用命令
hexo new postName #新建文章 在source/_posts 下生成
hexo new page pageName #新建页面 在source/pageName 下生成
hexo deploy #将.deploy目录部署到GitHub 简写指令:hexo d
hexo generate #生成静态页面至public目录 简写指令:hexo g
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)简写指令hexo s
hexo clean #清除所有静态页面和缓存数据