【前端】Hexo 建站指南

前言

更好的阅读体验：https://blog.dwj601.cn/FrontEnd/Hexo/build-your-own-website-with-hexo/
笔记记多了，想要分享给同学们一起交换进步，该怎么办？想要搭建一个属于自己的知识库，不仅仅范围在 PC 上，移动端也能随时检察与编辑，该怎么办？搭建一个属于自己的博客网站是是一个不错的选择！现在主流建站模式有两个：

• 有后端：WordPress；
  
• 无后端：Hexo、VuePress、Gatsby。
  

有后端的博客网站可以是可以，但是对于轻量化的个人知识博客显得有些笨重，而无后端的「静态站点」很适合更新不怎么频仍的中小型知识库场景。所谓的静态站点，其实就是使用一个转换工具将自己写好的 Markdown 笔记文件转换为 HTML 文件，打包摆设后就可以全球共享了。也就是说我们只必要关注文章的内容本身，即可在极短的时间内构建一个全部人都可以访问的博客网站。
本博客以 Hexo 为例讲解如何从零开始搭建一个自己的博客网站。在开始之前，你必要确保当地机配置好了 Node 运行时环境、Git 工具链和一个 GitHub 账号。
天生站点

我们必要创建一个假造环境用来管理我们博客网站的内容。
1）安装 Hexo 的下令行工具

1. npm install
2. -g hexo-cli

复制代码

2）初始化一个静态站点

1. hexo init

复制代码

3）安装全部依赖

1. npm install

复制代码

当地测试

1）天生静态文件

1. hexo generate  # 可简写为 hexo g

复制代码

2）启动当地服务

1. hexo server  # 可简写为 hexo s

复制代码

Hexo 服务默认占用 4000 端口。现在用欣赏器访问 http://localhost:4000，如果可以看到 Hexo 的默认博客网站，那么你已经成功了大半。
摆设云端

这里先容一种容错率较高的摆设方案。基于 Hexo 插件 hexo-deploy-git 将网站摆设到 GitHub Pages 上。
   简朴先容一下 GitHub Pages。这是 GitHub 官方提供的静态站点托管平台，其可以以「项目、个人和构造」三种情势进行托管，比方项目可以通过 https://<username or organization>.github.io/<project>/ 访问到；个人可以通过 https://<username>.github.io/ 访问到；构造可以通过 https://<organization>.github.io/ 访问到。
  下面以项目摆设方式为例，将站点摆设到 https://<username>.github.io/<repo>。
1）安装 Hexo 摆设包 hexo-deployer-git

1. npm install
2. hexo-deployer-git --save  # --save 是为了写入库依赖表 packge.json

复制代码

2）创建一个 GitHub 仓库并将当地项目推送到 GitHub（如果想要以个人或构造的情势建站，就将仓库名取为 <username or organization>.github.io，否则随意）

1. git add .
2. git commit -m 'init'
3. git remote add origin https://github.com/Explorer-Dong/demo.git
4. git push -u origin main

复制代码

3）配置 _config.yml 文件（假设仓库名为 demo 并且将站点托管在推送到仓库的 public 分支下）

1. # 网站地址
2. url: https://explorer-dong.github.io/demo
4. # 部署策略
5. deploy:
6.   type: git
7.   repo: https://github.com/Explorer-Dong/demo.git
8.   branch: public

复制代码

4）摆设（其实就是把天生的网站 push 到上述摆设战略的仓库分支中）

1. hexo deploy  # 可简写为 hexo d

复制代码

5）配置 Github Pages。选择 Source 为 Deploy from a branch 并选用 public 分支

现在访问 https://<username>.github.io/demo/，如果可以看到与之前当地测试时一样的界面，恭喜你，现在已经可以在项目标 source/_post/ 目次下撰写博客并且全球共享了！
参考

搭建教程：Luke教你20分钟快速搭建个人博客系列(hexo篇)
个性定制：GitHub Pages + Hexo搭建个人博客网站，史上最全教程

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。