美文网首页效率工具
Hexo博客搭建步骤

Hexo博客搭建步骤

作者: 砒霜拌辣椒 | 来源:发表于2020-11-08 15:42 被阅读0次

    Mac系统安装为例,其它WindowsLinux系统安装都是大同小异。

    1、下载安装nodejs

    下载地址:https://nodejs.org/zh-cn/ ,选长期支持版本进行下载安装。

    node -v命令验证是否安装成功。

    zhaoxb:hexo_blog zhaoxiaobin$ node -v
    v12.19.0
    

    2、安装淘宝镜像cnpm

    npm install -g cnpm --registry=https://registry.npm.taobao.org

    cnpm -v命令验证是否安装成功。

    zhaoxb:hexo_blog zhaoxiaobin$ cnpm -v
    cnpm@6.1.1 (/usr/local/lib/node_modules/cnpm/lib/parse_argv.js)
    npm@6.14.8 (/usr/local/lib/node_modules/cnpm/node_modules/npm/lib/npm.js)
    node@12.19.0 (/usr/local/bin/node)
    npminstall@3.27.0 (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js)
    prefix=/usr/local 
    darwin x64 19.4.0 
    registry=https://r.npm.taobao.org
    

    安装这个主要是为了后面安装插件能够加快下载速度。

    3、安装hexo

    cnpm install -g hexo-cli

    hexo -v命令验证是否安装成功。

    zhaoxb:hexo_blog zhaoxiaobin$ hexo -v
    hexo: 5.2.0
    hexo-cli: 4.2.0
    os: Darwin 19.4.0 darwin x64
    node: 12.19.0
    v8: 7.8.279.23-node.44
    uv: 1.39.0
    zlib: 1.2.11
    brotli: 1.0.9
    ares: 1.16.0
    modules: 72
    nghttp2: 1.41.0
    napi: 7
    llhttp: 2.1.2
    http_parser: 2.9.3
    openssl: 1.1.1g
    cldr: 37.0
    icu: 67.1
    tz: 2019c
    unicode: 13.0
    

    4、创建博客目录并初始化

    选择在自己喜欢的目录下创建博客目录作为workspace

    mkdir hexo_blog
    cd hexo_blog
    hexo init
    

    博客文章所在目录为source/_posts,默认会有一篇Hexo的介绍文档。

    在这个目录下可以新建markdown格式的文件来创建一篇博客文章,会被转成html页面来进行展示。

    当然也可以在博客目录hexo_blog下使用hexo n xxx命令来创建一篇文章,最后效果也是在source/_posts目录下生成一个名为xxx.md的文件。

    hexo n xxx
    

    5、启动查看效果

    hexo s命令启动服务,根据提示,浏览器打开http://localhost:4000/访问可以看到初始化的博客页面。

    6、github创建repositroy

    这里使用github pages功能,托管静态代码来做个人主页,仓库名称必须为 username.github.io,比如我的是senlinmu1008.github.io。仓库最好选择公开,以免影响访问。

    -w722

    当然这里并非一定要使用github,也可以使用国内的gitee pages或者coding也有托管个人博客的功能,只不过我个人使用下来还是github最好用最靠谱,只不过访问速度可能有点慢,可以用CDN加速来解决。

    7、安装部署插件

    进入到博客目录下执行安装插件。

    cd hexo_blog
    cnpm install --save hexo-deployer-git
    

    这个插件可以把生成的页面通过git推送到github仓库中,当然前提是你已经安装好了git工具。

    8、添加_config.yml文件的部署地址

    # Deployment
    ## Docs: https://hexo.io/docs/one-command-deployment
    deploy:
      type: git
      repo: https://github.com/senlinmu1008/senlinmu1008.github.io.git
      branch: master
    

    这里仓库地址repo填成实际个人的,就是git clone下代码的那个地址,可以用https也可以是SSH

    当然这里也可以使用gitee或者coding的仓库,也可以同时配置多个,比如:

    # Deployment
    ## Docs: https://hexo.io/docs/one-command-deployment
    deploy:
      type: git
      repo:
        github: git@github.com:senlinmu1008/senlinmu1008.github.io.git
        gitee: git@gitee.com:ppbin/ppbin.git
        coding: git@e.coding.net:zhaoxiaobin/blog/blog.git
      branch: master
    

    上面用的是SSH方式,好处就是配置了SSH keys以后都不用再输账号密码了。

    9、部署

    分别执行hexo ghexo deploy命令进行页面生成和远程部署。

    hexo g
    
    hexo deploy
    

    如果是第一次推送到github,这里可能会提示输入仓库的账号密码,如果配置了SSH keys则不需要输入。

    10、查看效果

    浏览器输入域名个人的username.github.io,比如senlinmu1008.github.io,不出意外的话,就可以看到当前个人博客的初始页面效果。

    到这一步其实个人博客已经搭建完成,当然个性化的配置以及自定义域名这些都是后续看个人喜好和需要了。

    11、更换主题

    可以在网上搜一些Hexo的主题,选择一个自己喜欢的,下载到themes目录下,然后修改_config.yml配置文件。

    # Extensions
    ## Plugins: https://hexo.io/plugins/
    ## Themes: https://hexo.io/themes/
    theme: butterfly
    

    修改为自己下载的主题名称。比如这里我个人用的是butterfly主题。如果对个性化配置要求比较高,可以学习下怎么配置主题,一般常用主题都会有详细而全面的教程来指导如何使用。

    11.1、更新主题

    如果后续主题升级了需要更新,可以使用以下步骤(需要切换到主题所在的目录中):

    # 将当前主题修改的内容增加到工作区
    git add .
    # 个人修改的暂存本地并还原已修改的文件
    git stash
    # 执行更新主题
    git pull
    # 恢复个人修改的文件内容,可能需要合并
    git stash pop
    

    12、常用命令

    一般Hexo的命令都要在博客所在目录即之前创建的workspace目录下执行才有效。

    命令 功能
    hexo clean 清除所有生成的页面文件
    hexo g 生成页面
    hexo deploy 推送部署到远程服务器
    hexo n xxx 新建一篇名为xxx的文章

    相关文章

      网友评论

        本文标题:Hexo博客搭建步骤

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