博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Hexo + Github 搭建个人博客
阅读量:5788 次
发布时间:2019-06-18

本文共 2366 字,大约阅读时间需要 7 分钟。

欢迎来到 ,受到的影响,决定开始搭建自己的博客。该文是我自己搭建博客的过程,采用的是 Hexo 博客框架管理,使用 Github 托管,将自己的域名关联到 Github Pages 上。

安装 git

  • 在 Windows 平台下载安装 Git,

  • 安装教程:

  • Git 的命令就是 Linux 的 shell 命令行:

  • 查看 Git 安装是否完成,在 win+r 中输入 cmd 命令窗口弹出后,输入 git –version 查看 git 版本

  • 设置 Git 的用户名和邮箱:

    $ git config --global user.name "scofieldwenwen"

    $ git config --global user.email "scofieldwenwen@163.com"

安装 Node.js

  • Node.js , 下载后基本都是点击下一步完成安装.
  • 查看 Node.js 是否安装完成,在 win+r 中输入 cmd 命令窗口弹出后,输入 node -v 查看 Node 版本

安装 Hexo

  • 在创建目标文件夹 (如 D:\hexo),在 hexo 文件夹里,单机右键选择 Git Bash Here,输入以下命令安装 Hexo : $ npm install -g hexo-cli

  • Hexo 初始化配置

    $ npm hexo init

    $ npm install

  • 初始化之后, hexo 的结构目录如下:[图片上传失败...(image-ceb47f-1536048027888)]

  • Hexo 常用的命令行: hexo help #查看帮助

    hexo init #初始化一个目录

    hexo new "postName" #新建文章

    hexo new page "pageName" #新建页面

    hexo generate #生成生成静态网页,可以在 public 目录查看整个网站的文件

    hexo server #本地预览,'Ctrl+C'关闭

    hexo deploy #部署.deploy目录

    hexo clean #清除缓存,强烈建议每次执行命令前先清理缓存,每次部署前先删除 .deploy 文件夹

    简写: hexo n == hexo new hexo g == hexo generate hexo s == hexo server hexo d == hexo deploy

  • Hexo 安装 server,生成静态文件后,用 server 启动服务器,从而预览。 $ npm install hexo-server --save

  • 可以就可以查看第一个 hexo 默认生成的 blog ,输入命令: $ hexo generate $ hexo server 在浏览器查看本地静态网页: [图片上传失败...(image-4d00a3-1536048027888)] 看到这个页面有点小激动,本地博客搭建起来了,不过只是个本地的网页而已,接下来就要把网页部署上去。

将博客部署到 Github Pages 上

  • 准备一个 Github 账号,没有的就去注册一个账号。

  • 创建一个仓库 repository,用来托管博客。仓库名必须为 [github用户名].github.io [图片上传失败...(image-4ef99-1536048027889)]

  • 配置 SSH 密钥教程:

  • 将本地的 Hexo 文件同步到 Github 的仓库中: 复制刚才创建仓库的 HTTPS 链接 [图片上传失败...(image-41cb6a-1536048027889)] 将链接粘贴到 Hexo 文件目录的 _config.yml 配置文件上保存: deploy: type: git repo: branch: master 注意:配置文件键值之间必须有个空格 将博客部署上去: $ hexo g $ hexo d 或者直接输入 $ hexo g -d 在浏览器查看 Github Pages,在浏览器输入 () 就可以看到自己的博客了!到这里一个免费的博客就创建好了。

配置博客以及主题

  • 配置博客:
  • 在 选取主题
  • 将主题在 Github 上打开,复制 Clone HTTPS ,然后在在 hexo\theme 目录下 clone 该主题,如我使用是Next主题 git clone
  • clone 成功后,修改 Hexo 目录中的配置文件 _config.yml 的主题 ,主题名字为 clone 下来的主题文件夹名称 theme: hexo-theme-next
  • 生成静态网页,查看本地效果 $ hexo g $ hexo s
  • 效果可以的话,就部署到 Github 上 $ hexo clean $ hexo g -d

将自己的域名关联上 Github Pages 上

  • 购买一个域名,我的是在上购买的。
  • 配置 CNAME 文件 在 \hexo\source 文件夹下创建文件 CNAME (没有后缀名),编辑内容,填写申请的域名。
  • 修改 DNS [图片上传失败...(image-339f21-1536048027889)]
  • 注意: 不能有不能有相同的主机记录,比如我的邮箱也有 @ 的主机记录,我就不需要邮箱就把它删了。

大功告成

  • 最后网页部署,浏览器输入域名()或者自己 Github Pages 的地址

总结

  • 搭建 hexo 中还会用到一些插件,这个因人而异,当然这些插件都是有说明文档的,照着来就行。
  • 万事开头难,但是一旦开始就要把它做好!
  • 接下来就是要坚持写自己的博客了,记录总结,留下自己成长的过程!

转载于:https://juejin.im/post/5b8e43a951882542e821b5cc

你可能感兴趣的文章
Rainbond 5.0.4版本发布-做最好用的云应用操作系统
查看>>
Java判断是否为垃圾_Java GC如何判断对象是否为垃圾
查看>>
多项式前k项和java_多项式朴素贝叶斯softmax改变
查看>>
oracle体系结构
查看>>
XP 安装ORACLE
查看>>
八、 vSphere 6.7 U1(八):分布式交换机配置(vMotion迁移网段)
查看>>
我的友情链接
查看>>
JS中比较数字大小
查看>>
jQuery插件的开发
查看>>
基础,基础,还是基础之JAVA基础
查看>>
JS prototype 属性
查看>>
HTTP库Axios
查看>>
gen already exists but is not a source folder. Convert to a source folder or rename it 的解决办法...
查看>>
20个Linux服务器性能调优技巧
查看>>
填坑记:Uncaught RangeError: Maximum call stack size exceeded
查看>>
SpringCloud之消息总线(Spring Cloud Bus)(八)
查看>>
KVO原理分析及使用进阶
查看>>
【348天】每日项目总结系列086(2018.01.19)
查看>>
【294天】我爱刷题系列053(2017.11.26)
查看>>
可替换元素和非可替换元素
查看>>