0%

用hexo搭建个人博客的过程记录

这是第一篇博客,主要记录用hexo搭建的过程和熟悉markdown的语法

1.包的安装和初始化

  • 安装node.js
  • 通过cmd打开windows的终端安装镜像包和hexo包
1
2
$ npm install -g cnpm --registry=https://registry.npm.taobao.org  
$ cnpm install -g hexo-cli
  • 在C盘下新建文件夹hexo_blog/
  • 回到终端初始化博客
1
$ hexo init
  • 至此windows终端上的操作结束,博客文章默认保存在hexo_blog/source/_posts在里面也可以看到自带的hello-world.md

2.部署远端仓库

  • 在github中新建仓库名qifeng1994.github.io
  • 在git bash中安装hexo插件
    1
    $ cnpm install --save hexo-deployer-git
  • 用编辑器打开hexo_blog/_config.yml
    在 # Deployment 的下面修改
    1
    2
    3
    4
    deploy:
    type: git
    repo: https://github.com/qifeng1994/qifeng1994.github.io.git
    branch: master
  • 回到git bash在hexo_blog/ 把本地仓库部署到github上
    1
    $ hexo d

    3.额外的修改

  • 为了解决插入图片后不显示的问题:
  • 修改_config.yml中设置
    1
    2
    3
    4
    post_asset_folder: true  

    # URL
    url: https://qifeng1994.github.io
  • 安装hexo额外的图片路径转换插件
    1
    $ cnpm install hexo-asset-image –save
  • 修改代码/node_modules/hexo-asset-image/index.js

    4.尝试写第一篇博客

  • 新建一篇博客
    1
    $ hexo n "文件名"
    注意这里的文件名就是md的文件名,而这篇博客具体的标题可以在md里面修改,在hexo_blog/source/_posts下生成了同名的文件夹用于存放图片
  • 由于安装了插件,插入图片时不采用md的语法
    1
    {% asset_img man.png 图片的说明 %}
  • 在本地写好博客之后,可以先在本地浏览器预览
    1
    $ hexo s
  • 生成静态文件
    1
    $ hexo g
  • 部署到远端
    1
    $ hexo d
  • 最下面是一个插入图片的例子

目前写markdown存在的问题

  1. 带后缀的句子会被识别为超链接
  2. 如何让插入的图片靠左边显示

目前遇到的坑

  1. 插入图片的时候后缀是大小写敏感的,比如,如果一个图片叫man.PNG,那么你插入的时候如果用

    1
    {% asset_img man.png %}

    就会显示不出来

  2. hexo d 部署后个人主页404的原因

    我之前把仓库的权限改成了privite,后来发现有一种说法是github如果想做个人主页的话,仓库必须要是public才行,然后尝试重新部署即可:hexo clean, hexo g, hexo d