一步一步教你部署hexo博客网站

先看效果：

目录

一、官网

二、安装Git和Node(最好是最新版本)

三、找个放项目的地方：新建一个文件夹 hexo并在该目录下执行命令

四、用WebStorm打开hexo文件夹

五、启动项目

六、打包（如果重复打包，每次打包之前，把public文件夹删除一下）

七、部署

八、访问 

九、安装nexmoe主题

十、启用主题

十一、配置主题

十二、再次启动

十三、再次部署发布

十四、访问 

十五、插件市场

十六、安装admin插件

---

一、官网

建站 | Hexo安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。 $ hexo init $ cd $ npm install 新建完成后，指定文件夹的目录如下： .├── _config.yml├── package.json├── scaffolds├── source| ├── _drafts| └─https://hexo.io/zh-cn/docs/setup

二、安装Git和Node(最好是最新版本)

三、找个放项目的地方：新建一个文件夹 hexo并在该目录下执行命令

npm install -g hexo-cli

npm install hexo

四、用WebStorm打开hexo文件夹

打开终端执行命令

npx hexo init home

cd home

 

五、启动项目

npx hexo server

六、打包（如果重复打包，每次打包之前，把public文件夹删除一下）

注意：如果是放在nginx的html的子目录的话，需要修改一下配置再打包

比如：在第七步，我在html下新建hexo文件夹作为项目的根目录，则修改_config.yml配置：

加入：root: '/hexo'

npx hexo deploy

七、部署

在nginx的html目录下新建hexo文件夹：

 将打包的public里面的文件复制到hexo目录中：

八、访问 

九、安装nexmoe主题Hexo Theme Nexmoe | 🔥 A rather special Hexo theme🔥 A rather special Hexo themehttps://docs.nexmoe.com/

npm install hexo-theme-nexmoe

十、启用主题

修改_config.yml文件如下：

十一、配置主题

访问以下配置

GitHub - nexmoe/nexmoe.comContribute to nexmoe/nexmoe.com development by creating an account on GitHub.https://github.com/nexmoe/nexmoe.com

记得将root改成你自己的，如果是nginx的html根目录则不用改。 

小插曲1：博主复制_config.yml文件的时候，nofollow部分的缩进自动换行了，导致配置错误。

小插曲2：主页的静态图片看不到了，缺少了hexo文件夹的前缀，_config.nexmoe.yml中配置一下就好了

十二、再次启动

npx hexo server

十三、再次部署发布

首先删除public文件夹，再次打包部署

npx hexo deploy

 将public中的文件上传到nginx的html目录下的hexo文件夹中：

十四、访问 

十五、插件市场

插件 |六角形 (hexo.io)https://hexo.io/plugins/

十六、安装admin插件

安装插件 

npm install --save hexo-admin

 卸载插件

npm uninstall hexo-admin

访问admin地址 http://localhost:4000/admin

设置账号密码：

 重启后再次访问

十七、其他主题

分类：二进制杂谈 | Yume Shoka = 優萌初華 = 有夢書架琉璃的医学 & 编程笔记https://shoka.lostyu.me/categories/computer-science/note/

GitHub - amehime/hexo-theme-shoka: Just For https://shoka.lostyu.me/Just For https://shoka.lostyu.me/. Contribute to amehime/hexo-theme-shoka development by creating an account on GitHub.https://github.com/amehime/hexo-theme-shoka

Yume Shoka = 優萌初華 = 有夢書架琉璃的医学 & 编程笔记https://shoka.lostyu.me/

GitHub - JoeyBling/hexo-theme-yilia-plus: 一个简洁优雅的hexo主题 A simple and elegant theme for hexo.一个简洁优雅的hexo主题 A simple and elegant theme for hexo. - GitHub - JoeyBling/hexo-theme-yilia-plus: 一个简洁优雅的hexo主题 A simple and elegant theme for hexo.https://github.com/JoeyBling/hexo-theme-yilia-plus

 闪烁之狐从来没有真正的绝境，只有心灵的迷途http://blinkfox.com/

十八、Shoka主题（不要在其他主题上更换主题，而是新建hexo项目来安装）

执行第一步到第五步：

npm install -g hexo-cli

npx hexo init home

cd home

安装Shoka主题依赖

 npm i hexo-renderer-multi-markdown-it --save
 npm i hexo-autoprefixer --save
 npm i  hexo-algolia --save
 npm i hexo-algoliasearch --save
 npm i hexo-symbols-count-time --save
 npm i hexo-feed --save

 小插曲：安装hexo-symbols-count-time的时候报错了，说是highlight.js不支持9及以前的版本

解决：在package.json里加入依赖

    "highlight.js": "10.7.3"

npm install

 重新安装一下hexo-symbols-count-time 就好了

npm i hexo-symbols-count-time --save

利用Git下载主题到项目中

git clone https://github.com/amehime/hexo-theme-shoka.git ./themes/shoka

 

修改_config.yml文件主题为shoka

 

shoka的配置都在主题下的_config.yml文件中（注意不是项目的_config.yml配置）

配置文件解释（采取默认就行，有些功能没有开启，可以选择性的开）：Step.2 基本配置 - Theme Shoka Documentation - 二进制杂谈 - 计算机科学 | Yume Shoka = 優萌初華 = 有夢書架🚀快速开始 - 💌依赖插件 - 📌基本配置 - 🌈界面显示 - 🦄特殊功能 # 站点别称 alternate: Yume Shoka这里设置的名称代替 Logo，显示在页面顶部，以及页尾©️处 # 静态文件目录 statics: / #//cdn.jsdelivr.net/gh/amehime/shoka@latest/默认值是 / ，指使用本地静态文件 可以修改成 //cdn.jshttps://shoka.lostyu.me/computer-science/note/theme-shoka-doc/config/启动项目看效果：