个人博客搭建

Posted on | Post modified: | In
Words count in article: 460 | Reading time ≈ 1

在GitHub上搭建一个个人博客，作为笔记日志的存放。

环境

  • OS: windows10
  • Node: >=10.0.0
  • Git: >=2.17.1

工具/平台

1
2
3
4
5
6
GitHub  -- 博客
Hexo    -- 博客框架
NexT    -- 博客主题
gitee   -- 图床
PicGo   -- 图片上传管理
Typora  -- 编辑器

步骤

GitHub

  1. 注册账号

  2. 新建仓库
    名称格式：username.github.io
    这也是博客的访问地址。

    image-20200531202258405

Hexo

  1. 安装Hexo脚手架并创建项目

    1
    2
    3
    4
    5
    npm install hexo-cli -g
    hexo init blog
    cd blog
    npm intall
    hexo server

  2. 编辑站点配置文件
    编辑根目录下_config.yml文件，包括Site、URL、Deployment等。

  3. 常用命令

    1
    2
    3
    4
    5
    6
    hexo init [folder]               # 新建网站
    hexo new [layout] <title>        # 新建文章
    hexo generate                    # 生成静态文件
    hexo server                      # 启动服务
    hexo deploy                      # 部署网站
    hexo clean                       # 清除缓存文件和静态文件

  4. 部署到GitHub
    站点配置文件的Deployment如下配置：

    1
    2
    3
    4
    5
    6
     # Deployment
     ## Docs: https://hexo.io/docs/deployment.html
     deploy:
       type: git
       repo: https://github.com/GeoDaoyu/GeoDaoyu.github.io.git
    branch: master

    命令行输入命令进行推送部署：

    1
    hexo d

注：如报错无法加载hexo.psl文件，修改windows的设置，允许powershell脚本在未签名的情况下运行即可。

NexT

  1. 下载并启用主题

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

    打开站点配置文件， 找到 theme 字段，并将其值更改为 next。

    1
    theme: next

  2. 设定主题

    • 选择Scheme
    • 设置语音
    • 设置菜单
    • ……

gitee

  1. 注册账号
  2. 新建仓库
    名称随意，仓库作为图床使用。
  3. 获取token

PicGo

  1. 下载安装

  2. 配置图床
    在插件设置中搜索gitee，然后下载安装。
    image-20200531202258405

    在图床设置中设置参数，

    1
    2
    3
    4
    5
    owner: gitee的用户名
    repo: 项目名称
    path: 项目下的路径
    token: gitee的token
    message: 代码提交的说明，随意填写

    image-20200531202442036

Typora

  1. 下载安装

  2. 配置图片上传
    image-20200531212036484

    复制一份到本地，然后手动点击上传的时候再上传。