美文网首页
使用Github+Hexo搭建自己的博客、

使用Github+Hexo搭建自己的博客、

作者: 晴天ccc | 来源:发表于2019-03-21 14:02 被阅读0次

一、 搭建环境

1、下载安装Node.js

验证结果:

// 终端输入:
node -v 
// 输出结果
v10.15.3
// 终端输入:
git version
// 输出结果
git version 2.17.2 (Apple Git-113)

辅助命令:

查看当前node版本号: node -v
清除node.js的cache: sudo npm cache clean -f  
安装最新版本node:sudo n stable
查看当前git版本号: git --version

2、使用npm安装Hexo

//  安装命令
sudo npm install -g hexo
// 查看Hexo的版本
hexo version                       

验证结果:

hexo-cli: 1.1.0
os: Darwin 17.7.0 darwin x64
http_parser: 2.8.0
node: 10.15.3
v8: 6.8.275.32-node.51
uv: 1.23.2
zlib: 1.2.11
ares: 1.15.0
modules: 64
nghttp2: 1.34.0
napi: 3
openssl: 1.1.0j
icu: 62.1
unicode: 11.0
cldr: 33.1
tz: 2018e

二、Hexo配置本地Blog

1、用hexo初始化、

桌面创建文件夹hexo_wnkp_blog(作为本地博客地址),并cd到该文件夹下。

  • 初始化hexo
hexo init 
  • 安装npm:
npm install
  • 开启hexo服务器:
hexo s

ps:此时,在浏览器中打开网址:http://localhost:4000 能看到Hexo的网页信息

三、创建GitHub项目,并关联

  • 点击打开GitHub ,新建仓库,固定写法:“用户名.github.io” 这里以wnkpzzz.github.io为例。
3、点击设置, 创建一个page
4、将我们Hexo的代码部署到github上

用文本编辑器打开桌面 hexo_wnkp_blog 文件夹下的_config.yml文件,修改博客内部部分参数,然后保存。【这里一定要注意项目地址和前面的空格!!!】

deploy:
    type: git
    repository: https://github.com/wnkpzzz/wnkpzzz.github.io.git
    brachanc: master
  • 通过命令部署到github上
//安装个插件
npm install hexo-deployer-git --save         
//hexo deploy 部署的命令,发布到Github
hexo d          

过程中需要输入GitHub的账号和密码。

5、部署完成之后,打开浏览器访问 https://wnkpzzz.github.io 查看效果。

四、安装主题

默认的主题都比较普通,想要炫酷效果就需要安装主题。我们选择主题,这里以hexo-theme-next为例,当然可以选择其他的,用法都一样。

//进入博客目录
cd hexo_wnkpzzz_blog
//克隆到本地博客
git clone https://github.com/iissnan/hexo-theme-next themes/next
  • 博客配置:用文本编辑器打开hexo_wnkpzzz_blog文件内的_config.yml文件,修改内部参数。
title: Wnkp's Blog
language: zh-Hans
theme: next

参数说明以及详细的设置情况可以看官方文档:http://theme-next.iissnan.com/getting-started.html

  • 配置完成之后,通过如下命令后预览博客:
//进入博客目录
cd hexo_wnkpzzz_blog
//清除缓存
hexo clean
// hexo generate重新生成代码
hexo g
// hexo server 部署到本地
hexo s

打开浏览器访问 localhost:4000 查看效果!

  • 预览没问题之后,就可以发布了。
hexo d  //  hexo deploy 部署的命令,发布到Github。

打开浏览器访问 https://wnkpzzz.github.io 查看效果。

五、新建博客文章

//进入博客目录
cd hexo_wnkpzzz_blog
//新建文章命令
hexo new "初创博客,请多关照、"

结果显示:

INFO  Created: ~/Desktop/hexo_wnkpzzz_blog/source/_posts/初创博客,请多关照、.md

在hexo_wnkpzzz_blog/source/_posts目录下生成 name.md文件,这个文件支持Markdown语法。文章写完之后, 通过如下命令后,在浏览器中打开网址:http://localhost:4000 预览本地博客、

//进入博客目录
cd hexo_wnkpzzz_blog
//清除缓存
hexo clean
// hexo generate重新生成代码
hexo g
// hexo server 部署到本地
hexo s

预览没问题之后,就可以发布了。

//进入博客目录
cd hexo_wnkpzzz_blog
//  hexo deploy 部署的命令,发布到Github
hexo d

打开浏览器访问 https://wnkpzzz.github.io 查看效果。

相关文章

  • MarkDown 基本语法

    最近在研究使用github+Hexo来搭建自己的博客,所以引申出学习使用Markdown,在这里记录下Markdo...

  • hexo+github搭建博客

    昨晚搭建好了自己的博客,使用github+hexo。 下载安装Git Git官网下载地址:https://git-...

  • HEXO搭建个人博客

    参考文档 看一下windows系统:2018.5月使用Github+Hexo搭建自己的博客2018最新版hexo+...

  • Mac OS使用github+hexo搭建自己的博客

    沉寂了好久木有更新东西啦,最近忙死.....说正事。 如题,使用github+hexo搭建自己的博客,虽然这样的博...

  • 通过Travis来自动构建博客

    本文基于熟练搭建基于github+hexo搭建博客的基础上,并且对github简单操作,并且会使用通过ssh的方式...

  • 使用Github+Hexo搭建自己的博客、

    一、 搭建环境 1、下载安装Node.js Node.js:点击下载Node.js安装包一键安装 Git:使用命令...

  • 解决Hexo标签与MD文件冲突问题

    今天使用 Github+Hexo 搭建的博客写文章时遇到一个 Bug,查阅资料解决之后,发现很多人都遇到过由于 n...

  • 基于github+hexo全过程

    基于github+hexo搭建个人博客全过程 VENI VIDI VICI 时值2018清明假期,最近趁着换工作的...

  • Markdown入门教程

    写在前面 之前在 CSDN 写过一段时间的博客,使用的是传统的文本。最近利用 Github+Hexo 搭建了一个静...

  • Markdown和微信公众号排版

    前言 微信公众号排版复杂,但推广方便;Github+Hexo搭建个人博客,写作方便(Markdown语言),但推广...

网友评论

      本文标题:使用Github+Hexo搭建自己的博客、

      本文链接:https://www.haomeiwen.com/subject/nxpqvqtx.html