使用hexo在GitHub上搭建自己的博客
hexo
- 分享一个快速、简洁且高效的博客框架
- 你看到的这个博客就是通过以下方式搭建的
安装 hexo
安装前的准备
npm 全局工具安装
- 安装好 Node 和 Git 之后,直接通过 npm 即可完成 hexo 的安装
- 打开命令台输入:
npm install hexo-cli -g
搭建个人博客
blog
- 安装完成之后在你想要搭建博客的文件夹里面
- 按着 【shift】 右击鼠标,选择在此处打开命令窗口
输入下面的命令:
hexo init blog # 初始化一个 blog 会从网上下载一个模板,可能比较慢 cd blog # 进入 blog 根目录 hexo server # 开启本地服务器 在浏览器中输入 localhost:4000 即可访问
完成之后文件夹结构为:
blog/ // 网站结构 ├── node_module/ // 第三方依赖包 ├── scaffolds/ // 模板文件夹 ├── source/ // 网站源文件 | └── _posts/ // 文章列表页 ├── themes/ // 主题文件夹 | └── landscape/ // landscape 主题 ├── .gitignore // ├── _config.yml // 网站整体配置文件 └── package.json // 网站信息
jacman 主题
- 这里默认的主题为 landscape ,不喜欢这个
- 换个 jacman 主题
在博客根目录下执行下面命令:
git clone https://github.com/wuchong/jacman.git themes/jacman
- 启用该主题
- 打开博客根目录下的
_config.yml
配置文件 - 修改文件中的
theme
属性: theme: jacman
- 刷新页面即可看到主题已被修改
- 现在本地的 blog 就已经搭建成功
将个人博客部署到 GitHub 上
- GitHub 的注册登录就不多说了
- 首先在 在 GitHub 上创建一个仓储
- 该仓储的命名有一定的规则 (userName).github.io
- (userName) 是自己的用户名
- 仓储创建完成之后,回到本地
- 这时需要在本地博客根目录下执行下面一句代码
- 为了是生成静态页面,因为 GitHub 只支持静态页面的搭建
hexo generate
- 执行完之后就会多一个 public 文件夹,该文件夹就是生成的所有博客的静态资源
- 这时就可以进入 public 文件夹,将该目录下的所有文件上传 GitHub 下刚才创建的仓储
- 上传完成之后
- 通过访问
http://(userName).github.io/
- 此时就完成了 blog 基本框架就搭建完成了
- 接下来就是创建自己文章了
- 进入 blog 根目录,运行 CMD
- 输入
hexo new (postName)
# postName 为文章名 - 输入
hexo new page (pageName)
# 新建一个页面(列表页) - 创建完新文章之后就可以进行 MarkDown 编辑了
- 完成之后,继续执行
hexo generate
- 最后再 push 到 GitHub 上,就完成了