一、安装并且启动Hexo

1、安装git和node

git: https://git-scm.com/

node:https://nodejs.org/en

2、安装Hexo

1
npm install -g hexo-cli

3、创建Hexo项目

在终端中运行以下命令来创建一个新的 Hexo 项目。这里的 myblog 是你的博客目录，你可以换成你自己喜欢的名字：

1
2
3
4
5
6
hexo init myblog
cd myblog
npm install
```

这个命令会在当前目录下创建一个 `myblog` 目录，所有博客的文件都存放在这个目录中。

4、生成静态文件

hexo generate

1
2
hexo generate
这个命令会在 `public` 目录中生成静态文件。你可以使用任何静态服务器来部署这个目录。

5、启动服务器

1
2
3
4
hexo server
```

这个命令会启动一个服务器，你可以在浏览器中输入 `http://localhost:4000` 来预览你的博客。

二、使用github page托管

​ Hexo是静态页面,可以使用github托管hexo项目,使用github用自定义域名不用备案,因为github服务器不是在国内的

1、在 _config.yml 文件中添加以下内容

1
2
3
4
5
6
7
8

deploy:
  type: git
  repo: <repository url>
  branch: gh-pages
```

其中，`<repository url>` 是你的 GitHub 仓库的 URL。

2、修改url和root

在你的 Hexo 配置文件 _config.yml 中，确保 url 和 root 的设置正确。url 应设置为你的 GitHub Pages 网址，root 应设置为你的 GitHub Pages 仓库名。

例如，如果你的 GitHub 用户名是 username，你的仓库名是 repo，那么你的配置应该类似于：

1
2
url: https://username.github.io/repo
root: /repo/

如果你的 Hexo 博客直接托管在 <username>.github.io 下，那么 root 应设置为 /：

2、安装 hexo-deployer-git 插件：

​ 进入项目根目录,执行下面命令

1
npm install hexo-deployer-git --save

3、运行以下命令来部署你的博客：

1
2
hexo clean
hexo deploy

4、访问

1
https://<username>.github.io/<repository>/

5、注意事项

​ (1): 仓库要设置为public、私有仓库使用github page 要收费

​ (2): 设置部署分支

image-20230714142244315

(3)、如果样式失效

​ 1、查看_config.yml 文件中 url 和 root 配置是否正确

​ 2、清空缓存重新部署

1
2
3
hexo clean
hexo generate
hexo deploy

三、配置自定义域名

1、添加 CNAME 文件

​ 创建一个名为 CNAME 的新文件(没有扩展名),放在根目录resorce目录下,在这个文件中，写入你的自定义域名：

​ 例如:

1
zykpro.cn

​ 不要加域名前缀、比如https://, 部署后查看github仓库CNAME文件，如果内容为空检查CNAME 文件应该放在 source 目录下，这样在生成网站时，它会被复制到public 目录。如果你的 CNAME 文件位于其他地方，可能就会在生成网站时丢失。如果还是为空，手动在public文件夹中CNAME文件添加，然后直接部署（不要执行clean和generate命令）

image-20230715123741439

2、配置DNS

​ 添加类型为A的DNS解析记录

  • 185.199.108.153
  • 185.199.109.153
  • 185.199.110.153
  • 185.199.111.153

如果你的域名支持 www 子域名，你还需要添加一条类型为 CNAME 的 DNS 记录，将 www 子域名指向你的 GitHub Pages 域名（例如，username.github.io）。

3、修改_config_yml 配置文件

1
2
url: http://zykpro.cn
root: /

4、清空缓存重新部署

1
2
3
hexo clean
hexo generate
hexo deploy

四、部署后图片加载失败

md文件插入图片使用的是路径获取的，如果没有正确设置路径，在hexo页面上是看到不图片的，可以结合Typora软件配置

1、修改Typora文件保存路径

把图片放在resource文件夹下面就可以访问到了、这样在md文件添加图片，图片就会自动保存到assets文件夹下面

image-20230715060124229

__END__