hexo-hello

hexo+github搭建博客服务器

1. csdn,简书,有道笔记 - 广告比较多
2. hexo+github[比较慢,翻墙]/gitee[Git pages服务器 - 维护]/阿里云服务器

安装nodejs

1. 非中文的非特殊字符的目录中[目录中不要出现空格或者带有特殊符号的]
2. D:/node-v14.17.3-win-x64

环境变量的配置

1. 桌面计算机 - 右击 - 属性 - 高级系统设置 - 环境变量(N)

2. 定位到下方的系统变量

3. 定位到变量名 - Path - 编辑 - 新建

4. D:/node-v14.17.3-win-x64

5. 一定要关闭所有的环境变量配置的窗口 - 确定

6. 打开终端[如果终端已经打开了,关闭 - 重新打开]

   win[微软图标]+r - 输入cmd - 输入如下指令检测nodejs是否配置成功

   npm -v
   6.14.5 出现版本号,则说明配置成功
                  
   如果出现了不是内部或者外部的命令的同学,请检查自己的nodejs解压缩之后的路径是否
   成功配置到了path中
   

简单认识npm

npm是javascript的一个**包[前端框架]**管理工具,并且是nodejs平台默认的包管理工具.

通过npm可以安装,共享,分发代码,管理项目依赖关系.

类似于java中的maven或者gradle[强大的项目构建工具以及项目依赖管理工具]

npm简单使用

修改镜像

为了下载速度变快,修改npm的镜像

npm config set registry https://registry.npm.taobao.org

验证一下,镜像是否成功修改了

npm config get registry

https://registry.npm.taobao.org/

简单使用 - 不需要操作

1. 下载bootstrap

   npm install 框架名称 - 默认下载的是最新的版本

   npm install bootstrap@3
   

Hexo官网

https://hexo.io/zh-cn/docs/

安装

1. 假设你在D盘根目录下新建了一个文件夹hello-hexo[博客项目的根目录]

2. win+r - 打开终端

3. 通过dos命令进入到hello-hexo目录中

   C:/User/admin>d:
   D:>cd hello-hexo
   D:/hello-hexo>npm install hexo-cli -g
   

创建真正的博客目录

D:/hello-hexo>hexo init hello-blog

cd hello-blog
D:/hello-hexo/hello-blog>npm install

测试 - 启动博客服务器

D:/hello-hexo/hello-blog>hexo s

关闭服务器

ctrl+c

打开浏览器输入:localhost:4000

常用主题模板

https://blog.csdn.net/zgd826237710/article/details/99671027

使用git命令来进行克隆,需要提前安装好git,检测git是否安装成功,重新打开终端

git --version

注册码云账号

推荐用QQ注册一下

本地配置码云账号信息 - 配置文件 - 位置windows的用户主目录下

C:/User/计算机用户名 - 观察是否存在**.gitconfig**文件,添加如下内容

[user]
    email = 码云的QQ邮箱
    name = 用户名

安装模板

通过cmd进入到hello-blog目录中的themes目录中

D:/hello-hexo/hello-blog>cd themes
D://hello-hexo/hello-blog/themes>git clone https://gitee.com/guancg/hexo-theme-pure.git

或者直接从github上直接clone

git clone https://github.com/cofess/hexo-theme-pure.git

更新主题配置

1. 指定新的主题

   hello-blog目录下的_config.yml文件

   theme: hexo-theme-pure
   

2. 重启服务器hexo s

个人信息

hexo-theme-pure/_config.yml文件

overriden
  author: 亲爱的管管
  author_title: 高级打字员
  author_description: 个人简介。
  location: SuZhou, China

Markdown语法

语法的编辑器 - https://typora.io/

文件的后缀是md

常用语法如下:

1. 标题的语法:
1~6标题 - # 一级标题    ## 二级标题   

2. 代码块 - java,js,mysql...

​~~~java 敲enter键

3. 列表
3-1. 无序列表
     * 列表名称
     
     有序列表
     1. 列表名称
     
4. 高亮显示
   `高亮显示内容`
   
5. 加粗字体
   **粗体**
   
6. 斜体
   *斜体*
   
7. 粗+斜
   ***粗斜***
   
8. 段落
   > 空格
   
9. 引入外部图片
   ![](xx.png)
   
10. 表格

新建博文

D://hello-hexo/hello-blog>hexo n java

效果:hello-blog目录下的source/_ports/自动生成一个java.md文件

重启blog服务器

D://hello-hexo/hello-blog>hexo s

主题的侧边栏

侧边栏的链接生效

将/hello-blog/themes/hexo-theme-pure/_source/下的除了_data文件夹,其余文件夹

拷贝一份放入到hello-blog目录下的source目录中即可

文章的分类和标签

只需要在文章的.md文件的自动生成的头部添加

title: java
date: 2021-07-13 08:44:42
categories: java
tags: java

博客的语言环境设置

设置中文

hello-blog下的_config.yml文件中

language: zh-CN

图片显示问题

1. 安装插件 - npm install https://gitee.com/guancg/hexo-asset-image.git –save

2. 需要到hello-blog/_config.yml文件中进行配置

   post_asset_folder: true
   

3. hexo n 机器学习

   效果就是除了生成了机器学习.md还有一个机器学习文件夹,那么这篇文章的所有的图片就可以存储在机器学习文件夹中

4. hexo s

内置搜索的功能

# Search
search:
insight: true # you need to install `hexo-generator-json-content` before using Insight Search
baidu: false # you need to disable other search engines to use Baidu search

安装内置搜索插件

npm i -S hexo-generator-json-content

评论

不需要本地数据库进行存储的,用的是第三方的.

LeanCloud - 官网地址 - https://www.leancloud.cn/

注册 - 登录 - 控制台 - 创建应用 - 右下设置 - 应用凭证

appId - sljUq97vUAdLAo7XQdf13aFR-gzGzoHsz

appKey - 3hn4ijEgSzJeRV4nkmXThmGV

在hexo-theme-pure\_config.yml文件中配置

valine: # Valine. https://valine.js.org
 appid: sljUq97vUAdLAo7XQdf13aFR-gzGzoHsz  # your leancloud application appid
 appkey: 3hn4ijEgSzJeRV4nkmXThmGV# your leancloud application appkey
 notify: false # mail notifier , https://github.com/xCss/Valine/wiki
 verify: false # Verification code
 placeholder: Just go go # comment box placeholder
 avatar: mm # gravatar style
 meta: nick,mail,link # custom comment header
 pageSize: 10 # pagination size
 visitor: true # Article reading statistic https://valine.js.org/visitor.html

#字数统计&阅读时长

1. npm i -S hexo-wordcount

2. hexo-theme-pure_config.yml文件中配置

   postCount:
     enable: true
     wordcount: true  # 文章字数统计
     min2read: true  # 阅读时长预计 
   

附件-优秀插件

1. 显示图片

   npm install https://gitee.com/guancg/hexo-asset-image.git --save
   

2. 内置搜索

   npm i -S hexo-generator-json-content
   

3. 字数统计&阅读时长

   npm i -S hexo-wordcount
   

4. github部署

   npm install hexo-deployer-git --save
   

github注册一下

github.com

chrome浏览器 + iguge - https://iguge.app/

新建的仓库的名称必须是guancgsuccess.github.io

仓库地址 - https://github.com/guancgsuccess/guancgsuccess.github.io.git

安装github部署插件

npm install hexo-deployer-git –save

hello-blog/_config.yml文件

deploy:
type: 'git'
repo: 'https://github.com/guancgsuccess/guancgsuccess.github.io.git'
branch: 'master'

hexo三连操作

hexo cl
hexo g
hexo s
hexo d

浏览器输入 - guancgsuccess.github.io