美文网首页
教你使用Hexo无脑搭建个人博客

教你使用Hexo无脑搭建个人博客

作者: 被代码耽误的裁缝 | 来源:发表于2019-10-10 23:36 被阅读0次

    开发环境

    1.git

    2.node.js

    3.安装 hexo 脚手架

    npm install -g hexo-cli
    

    建站

    创建项目、安装依赖

    # 将拉取 hexo 的 github 仓库的相关文件,拉取不成功的直接去 github 克隆或者下载压缩包
    # github 仓库地址: https://github.com/hexojs/hexo-starter.git
    hexo init myblog
    # 进入目录
    cd myblog
    # 安装项目相关依赖包
    npm install
    

    修改配置文件/myblog/_config.yml(也可以不修改),将网站名称改成自己,我的是这样的:

    # Site
    title: 邵中华
    subtitle: 犯我中华者,虽远必诛
    description: 
    keywords:
    author: Duke Shao
    language: zh-Hans
    timezone:
    

    创建文章

    hexo new myFirstPage
    

    默认生成的是myFirstPage.md 文件,可以自己去编辑器编写内容,经过编译会生成 html 文件

    # 编译文件
    hexo g
    # 开启服务
    hexo s
    

    打开 localhost:4000 ,查看效果。

    创建 Github Pages

    创建仓库

    在 Github 上创建一个仓库,名字为 username.github.io,username 是你 GitHub 的用户名。

    修改配置文件

    修改配置文件/myblog/_config.yml,repo 的值是你的仓库的地址,以下是我的:

    deploy:
      type: git
      repo: git@github.com:Duke1048/Duke1048.github.io.git
      branch: master
    

    发布到 github

    hexo d
    

    如果报错:ERROR Deployer not found: git ,安装插件:hexo-deployer-git

    npm install hexo-deployer-git --save
    

    打开 http://Duke1048.github.io/ 查看效果,可能存在延迟

    绑定自己的域名

    添加域名解析

    用阿里云、腾讯云...注册的域名都可以,我用的是腾讯云的。

    修改解析

    记录类型: CNAME //固定值
    主机记录: www.dukeshao.com  //添加 www 就好,后面固定是你自己的域名
    解析线路: 默认    //不用管,默认就好
    记录值: Duke1048.github.io //这是你 github pages 的访问地址
    TTL值: 600s  //延迟时间,不用管
    

    创建配置文件

    进入目录 /myblog/source/

    # 创建文件 CNAME
    touch CNAME
    

    CNAME文件没有文件类型,不用管,用编辑器或者直接在终端编辑文件,添加自己的域名(www.dukeshao.com) 就好

    完成

    # 编译
    hexo g
    # 部署发布到 github
    hexo d
    

    访问www.dukeshao.com就好了

    添加搜索功能

    安装插件

    在自己博客根目录下(我的目录:/Users/dukeshao/Documents/myblog),执行如下命令

    npm install hexo-generator-searchdb --save
    

    修改站点配置文件

    我的路径是:myblog下的_config.yml文件,添加以下代码。

    search:
        path: search.xml
        field: post
        format: html
        limit: 10000
    

    修改主题配置文件

    我的路径:/myblog/themes/next下的_config.yml文件,进行编辑。

    local_search:
        enable: true
    

    完成

    # 编译文件
    hexo g
    # 推送发布到 git 仓库
    hexo d
    # 开启本地服务
    hexo s
    

    首页文章预览功能

    Hexo 的 Next 主题默认是首页显示你每篇文章的全文内容,不爽,我要它只预览一部分。

    修改配置文件 /myblog/themes/next/_config.yml 文件:

    auto_excerpt:
        enable: false
        length: 150
    

    重启,搞定!

    相关文章

      网友评论

          本文标题:教你使用Hexo无脑搭建个人博客

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