搭建Hexo-Windows

发表于 | 更新于 | 分类于


Git

  1. 下载地址，官方文档，安装过程直接下一步，下一步。不信我的话，可以百度一下。

  2. 配置git

    1
    2
    git config --global user.email "you@example.com"
    git config --global user.name "Your Name"

Nodejs

  1. 下载地址，官方文档，推荐下载LTS（长期支持版）。
  2. 安装过程直接下一步，下一步。

  3. 安装完后，运行cmd，输入下面的命令，输出版本信息（友好的结果），说明安装成功。

    1
    npm version

  4. 查看配置信息。

    1
    npm config ls

  5. 修该软件仓库，模块安装路径。

    1
    2
    3
    4
    5
    #修改仓库
    npm config set registry "http://registry.npm.taobao.org/"

    #修改模块安装路径，注意是nodejs安装路径，默认是系统盘
    npm config set prefix  "D:\\Program Files\\nodejs"

Hexo

安装Hexo

  1. 官网地址，官方文档，安装命令如下。

    1
    2
    3
    4
    5
    #安装hexo模块
    npm install hexo-cli -g

    #卸载hexo模块
    npm uninstall hexo-cli -g

  2. 创建站点，下面命令中的hexo为你想为站点取的名字。

    1
    2
    3
    hexo init hexo
    cd hexo
    npm install

  3. 目录结构如下。

    • node_modules：是依赖包
    • public：存放的是生成的页面
    • scaffolds：命令生成文章等的模板
    • source：用命令创建的各种文章
    • themes：主题
    • _config.yml：整个博客的配置
    • db.json：source解析所得到的
    • package.json：项目所需模块项目的配置信息

主题配置

  1. 以Next主题为例，输入下面的命令安装Next主题，项目地址，官方文档。

    1
    2
    cd hexo
    git clone https://github.com/theme-next/hexo-theme-next themes/next

  2. 进入.\themes\next，Next主题的目录结构如下图。

  3. 个人的配置，仅供参考。 
    1
    2
    3
    4
    5
    6
    menu:
    	home: / || home
    	tags: /tags/ || tags
    	categories: /categories/ || th
    	archives: /archives/ || archive
    	schedule: /schedule/ || calendar

站点配置

  1. 打开站点配置文件，参考，官方文档。
  2. 个人配置，仅供参考 
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    title: Orangice
    author: orangice
    language: zh-CN
    post_asset_folder: true
    timezone: Asia/Shanghai
    per_page: 10 
    theme: next
    deploy:
      type: git
      repo: https://gitee.com/orangice/orangice.git
      branch: master

创建分类页面

  1. 首先要在“主题配置文件”中设置menu菜单开启categories

    1
    2
    3
    menu:
      home: / 
      categories: /categories

  2. 输入下面的代码，在sources目录下创建分类文件夹categories

    1
    2
    cd hexo
    hexo new page categories

  3. 修改”hexo\source\categories\index.md“，如下

    1
    2
    3
    4
    5
    ---
    title: 分类
    date: 2018-10-19 18:16:19
    type: "categories"
    ---

  4. 编写文章时在开头部分添加下面的代码，就能对文章进行分类，下面的是分类于Windows

    1
    categories: Windows

创建标签页面

  1. 首先要在“主题配置文件”中设置menu菜单开启tags。

    1
    2
    3
    menu:
      home: / 
      tags: /tags

  2. 输入下面的代码，在sources目录下创建分类文件夹tags。

    1
    2
    cd hexo
    hexo new page tags

  3. 修改”hexo\source\tags\index.md“，如下

    1
    2
    3
    4
    5
    ---
    title: 标签
    date: 2018-10-19 18:16:19
    type: "tags"
    ---

  4. 编写文章时在开头部分添加下面的代码，就能对文章进行分类，下面的标签为”软件安装“和“Hexo”

    1
    2
    3
    tag: 
      - Hexo
      - 软件安装

Gitee

  1. 国外有github，国内有gitee，下面以国内的git仓库“gitee”来部署hexo。

  2. 先去gitee注册一个账号，gitee原来叫码云，是开源中国的云开发平台，注册地址。

  3. 注册之后登陆，创建仓库，创建地址。

  4. 按下图进入gitpage页面后面，直接点击create，之后会显示gitpage地址。

  5. 打开站点配置文件，滑到最下面，修改如下代码，注意repo属性要改为你的仓库地址。

    1
    2
    3
    4
    deploy:
      type: git
      repo: https://gitee.com/orangice/hexo.git
      branch: master

  6. 安装hexo部署工具

    1
    npm install hexo-deployer-git --save

  7. 部署到gitee

    1
    2
    3
    4
    5
    6
    7
    8
    9
    cd hexo
    #生成网站目录
    hexo g
    #部署
    hexo d
    #之后输入账号和密码

    #如果账号和密码输入错误，之后部署会一直出错，可输入如下，重置密码
    git config --system --unset credential.helper

写文章

PicGo

  1. PicGo是一个快捷的图片部署工具，由于Hexo对图片的插入很繁琐，利用PicGo将图片部署到图床，在markdown文章中引用链接就能直接插入图片，PicGo支持很多品牌的图床，比如GitHub。
  2. 项目地址，官方文档，留张图，第一印象怎么样？

Typora

  1. Typora是一个markdown编辑器，如果之前未接触其他markdown编辑器的话，强烈建议直接使用Typora。由于它的实时预览方式和一般的编辑器不一样，因此之前使用过其他的编辑器的童鞋会有不适应感，不过用上半小时就会喜欢上它。

  2. 贴张图，是不是很漂亮？