Hexo 搭建个人博客

参考Hexo中文文档搭建个人博客，首先安装最新版本的NodeJS, Git。

安装 Hexo

$ npm install -g hexo-cli

安装完成以后，需要初始化一下项目，执行下列命令

$ hexo init
$ npm install hexo init
$ npm install

完成以后，项目大概目录就是这样的

├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

接下来可以在本地启服务来查看一下项目的初始状态

$ hexo server
INFO  Validating config
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

就可以访问 http://localhost:4000

发布到github并设置成个人博客

github上新建一个仓库

登录自己的github后，在界面右上角用户信息点击左边的加号，新建一个repository

然后给新建的仓库起个名字，注意：这个名字必须跟用户名一致，github才会默认设置成用户的博客

项目建好以后，就是一些信息的设置

设置页面里面有分支选项，如果有master分支，会默认成博客的首选代码。注意是master分之。

将本地搭建好的hexo发布到github上

在项目中生成静态文件

$ hexo generate

简写，结果是一样的

$ hexo g

安装插件

npm install hexo-deployer-git --save

修改网站配置文件_config.yml,添加deploy信息

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

上面的repo的配置信息，替换成自己的项目名字

本地跟远程github的连接已经建立，在项目中，直接生成静态文件，上传就可以了

$ hexo clean  //清除缓存文件db.json和已生成的静态文件public
$ hexo g   //生成网站静态文件到默认设置的public文件夹
$ hexo d   //部署网站到设定的仓库

手动安装样式 landscape

git clone https://github.com/hexojs/hexo-theme-landscape.git themes/landscape

上传本地图片

修改站点配置文件

/* 路径 /hexo/_config.yml
post_asset_folder: true

修改 _config.yml这之后，当你 hexo n XXX 时，会自动在 /hexo/source/_post 下生成一个 XXX 文件夹

安装路径转换插件|踩坑

注意，一定要下

npm install https://github.com/CodeFalling/hexo-asset-image --save

正确生成为

(base) MacBook-Pro:liukeya xinping$ hexo g
INFO  Validating config
INFO  Start processing
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky1.jpg
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky2.jpg
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky3.jpg
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky1.jpg
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky2.jpg
update link as:-->/2023/01/19/%E5%85%8B%E4%BA%9A%E8%90%A5%E9%94%80%E9%93%81%E5%BE%8B/lky3.jpg

注意，不要下

npm install hexo-asset-image --save

hexo-asset-image@1.0.0版本根本无法在 hexo g 生成的 *.html 文件中生成正确的 img src 的路径

错误生成如下，无法载入图片

$ hexo g
INFO  Start processing
update link as:-->/.com//Test.jpg
update link as:-->/.com//Test.jpg
......

本地测试+上传到GitHub

hexo g

hexo d

参考资料

使用Hexo和GitHub搭建个人博客
https://www.jianshu.com/p/e4cc63d59be5

使用账号密码来操作github
https://zhuanlan.zhihu.com/p/400646680