zoukankan      html  css  js  c++  java
  • Hexo+Github个人博客搭建 | 实战经验分享

    概述

    第一次尝试搭建属于自己的博客,并且成功了,非常开心。

    很久之前就想搭建一个博客,可是也一直没有行动,最近在逛B站的时候发现一个up主(CodeSheep)的一个视频 《手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo》: https://www.bilibili.com/video/av44544186/ ,哈哈哈哈哈给他免费打个广告(虽然根本没人能看到),简直就是保姆级的教学视频,良心up主啊,真·手把手教学,大体浏览了一下以后我就坐不住了,马上起来开电脑行动!

    那在这里就简单总结一下过程和遇到的坑吧

    [我的Hexo博客] :https://ilovemeow99.github.io/

    搭建博客

    博客是基于Hexo搭建的,需要Node.js、Git等支持

    我用的是windows系统,而up主是在MacOS系统下操作的,其实大同小异。

    安装Node.js

    • 搜索引擎搜索Node.js或者直接访问 https://nodejs.org
    • 下载左边那个LTS版本
    • 下载完成后安装,使用 Node.js 官方安装程序时,请确保勾选 Add to PATH 选项(默认已勾选)
    • 在cmd下分别输入命令行node -v和npm -v检查是否安装成功

    安装Git

    • 搜索引擎搜索git或者直接访问 https://git-scm.com/downloads
    • 选择对应的操作系统下载
    • 安装(在桌面或任意文件夹下右键菜单如果出现‘Git Bash Here’则说明成功)

    安装cnpm(可选)

    由于国内镜像源速度较慢,所以先利用npm下载cnpm

    在cmd中执行以下命令:

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

    安装Hexo

    用以下命令安装hexo(没有安装cnpm则换成npm即可):

    cnpm install -g hexo-cli

    完成后运行 hexo -v 查看版本以检查是否安装成功

    开始搭建博客

    创建一个文件夹,例如:D:log

    转到此路径,然后运行hexo init进行初始化,也可以直接用hexo init D:log

    看到INFO Start blogging with Hexo!则说明成功

    此时你会发现对应目录下已经为你自动生成了一些文件

    C:WINDOWSsystem32>d:
    D:>cd blog
    D:log>
    D:log>hexo init
    
    或者直接
    
    C:WINDOWSsystem32>hexo init D:log
    
    ...
    
    INFO Start blogging with Hexo!
    D:log>
    

    启动

    只需要hexo server或者直接简写hexo s即可启动

    D:log>hexo s
    INFO  Start processing
    INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
    

    看到以上提示说明启动成功,然后打开浏览器访问 http://localhost:4000 即可看到博客页面,CTRL+C断开。

    新建文章

    hexo new "My New Post"新建博客文章

    D:log>hexo new "我的第一篇博客文章"
    INFO  Created: D:logsource\_posts我的第一篇博客文章.md
    

    可以看到生成的文件是.md后缀即markdown格式,你需要了解一下markdown

    生成静态文件

    hexo generate或者hexo g

    生成静态文件。

    然后重新启动服务器即可看到新添加的文章了。

    部署博客

    这里我们用利用Github将博客进行免费部署。

    创建Github库

    首先你需要有一个Github账号,然后新建一个库,库的名字为:username.github.io

    注意此处username必须为你的用户名!

    安装部署插件

    打开命令提示符,转到你的博客目录下安装部署插件,或者直接在文件夹下 右键->'Git Bash Here',命令如下:

    cnpm install --save hexo-deployer-git

    更改配置文件

    在你的目录找到名为_config.yml的文件,用文本编辑器打开文件,找到最下面的‘deploy’项,将内容改为如下:

    deploy: type: git repo: https://github.com/username/username.githu.io.git branch: master

    注:username为你的用户名,repo其实就是你刚刚创建的库的地址加上后缀.git

    !!!注意格式与缩进,冒号后有一个空格!!!

    当然你也可以在site项里更改博客网页的title、description、author等。

    更改完成后保存。

    进行部署

    命令很简单只需要一行hexo d即可,过程会提示你输入你的Github的账号密码,正确输入即可。

    成功提示 INFO Deployer done: git

    然后刷新你的仓库你会发现多了很多东西

    访问博客地址

    部署完成后访问username.github.io

    如果出问题的话将Git与Github的用户名改为一致后重试

    查看用户名和邮箱地址:
    
    git config user.name
    
    git config user.email
    
    修改用户名和邮箱地址:
    
    git config --global user.name  "xxxx"
    
    git config --global user.email  "xxxx"
    

    更换主题

    这里推荐的是github用户litten提供的yilia主题: https://github.com/litten/hexo-theme-yilia

    方法:

    1. 下载

      cmd或者git bash,在之前的D:log目录下:

      git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

      即将主题文件克隆到D:log hemesyilia目录下

    2. 配置

      还是更改配置文件_config.yml,注意不是themesyilia目录下的,而是主目录下的

      找到theme,将默认的landscape改为yilia,保存。注意冒号后的空格!!!

    完成后

    hexo clean
    hexo g -d
    

    重新部署查看效果(可能存在一定的延时)

    更多内容 待更新。。。

  • 相关阅读:
    python常用字符串处理(转)
    Python读写文件基础.py
    Python异常和调试.md
    Python类的进阶.md
    Python模块和类.md
    python函数基础:调用内置函数&定义函数
    Spring.Net学习笔记(二)-数据访问器
    Spring.Net学习笔记(1)-容器的使用
    Spring.Net学习笔记(0)-错误汇总
    VS中设置xml智能提示
  • 原文地址:https://www.cnblogs.com/meow999/p/12035375.html
Copyright © 2011-2022 走看看