Open hzzzzzzzq opened 2 years ago
首先,我们先介绍一下 hexo 的一些主要命令,具体可以查看 hexo 官网 - 命令。
hexo
hexo init <file>
file
hexo generate
public
hexo g
hexo new [layout] <title>
source/_post
layout
post |draft |page
hexo server
http://localhost:4000/
hexo s
hexo deploy
hexo d
hexo clean
db.json
username.github.io
username
github
pages
choose a theme
readme
# 安装 hexo $ npm install -g hexo-cli
# 建立文档 # file - 文件路径 $ cd <file> $ hexo init # 或者 # 建立的文件路径/以及名称 # desktop/Blog。desktop为路径 Blog 为文件名称 $ hexo init <file>
来演示一次。
# file 到文件目录 $ cd <file> # 安装依赖 $ npm install
$ hexo server
我们通过 http://localhost:4000/ 就可以打开页面了,这就是默认页面了。
部署其实很简单,就是修改 hexo 文件的 _config.yml 底部的 deploy 部署代码。
_config.yml
deploy
# gitname: your github name # branch: 分支 # 下面注释掉的这种方式在2021年8月起,可能会报错,还是使用 ssh 的方式较好 # github: https://github.com/<gitname>/<gitname>.github.io.git deploy: type: git repo: github: git@github.com:<gitname>/<gitname>.github.io.git branch: <branch>
$ npm install hexo-deployer-git
所有上面的东西,部署好之后,就可以进行部署了,我们通过一下 hexo d 命令对 github 进行部署。
$ hexo generate $ hexo deploy
这时候我们的代码就部署到我们的 github 上了。
我们可以直接打开链接看一下 <gitname>.github.io,就可以看到我们部署的项目了,与 hexo s 运行结果相同。
<gitname>.github.io
我们来下载 next 主题
next
# 方式一 $ npm install hexo-theme-next@latest # 方式二 $ git clone https://github.com/next-theme/hexo-theme-next themes/next $ git pull #更新
使用方法一更好一些,但是如果就更改内容来说,可能方法二比较方便。
我们使用方法一来实现一次。
我们在修改 _config.yml 中的 theme 配置
theme
theme: next
然后我们执行命令,并对 github 进行部署。
$ hexo g -d
我们来看看,我们的成果吧,打开你自己的网页,username.github.io。
当然,部署命令执行之后,需要等待一会儿,不是马上就有的,如果你需要马上就有,可以执行 hexo s,先在本地看看是不是成功了。
这时候,我们就已经成功了。
但是有许多配置项可能都还不理解,我们进行分篇幅介绍。
我们再来介绍一个命令,如果你的主题是第一种下载方式(npm install hexo-theme-next@latest)。
npm install hexo-theme-next@latest
$ cp node_modules/hexo-theme-next/_config.yml _config.next.yml
使用上面的命令,将主题配置文件,移到根目录下。
我们再来看看现在的文件结构。
可以发现,多出来一个 _config.next.yml 配置文件。
_config.next.yml
我们在里面找到 menu,然后打开这四个路由
menu
在运行,看一下我们首页,就会多出一些标签路由。
当然,除了归档,其他点击都为空路由,因为,我们还没设置这两个文件夹。
$ hexo new page tag $ hexo new page categories
这是我们 source 文件夹下,多了两个文件夹。
source
这时候,在打开网站时,就可以打开相关页面了,其他路由同理。
Hexo 配置项 NexT 主题各类修改 NexT 主题Gitalk/disqus评论
hexo + github pages + next 主题,十分钟学会
介绍一下 hexo 的主要命令
首先,我们先介绍一下
hexo
的一些主要命令,具体可以查看 hexo 官网 - 命令。hexo init <file>
file
,Hexo 默认在当前的文件夹建立网站hexo generate
public
)hexo g
hexo new [layout] <title>
source/_post
文件夹下,layout
就是文章的布局,post |draft |page
hexo server
http://localhost:4000/
hexo s
hexo deploy
hexo d
hexo clean
db.json
) 和已生成的静态文件 (public
)。在某些情况(尤其是更换主题后),如果发现您对站点的更改无论如何也不生效,您可能需要运行该命令创建一个仓库
username.github.io
,username
就是你github
的名称pages
choose a theme
)之后,就会自动跳转到readme
的提交页面安装并运行 hexo
来演示一次。
我们通过
http://localhost:4000/
就可以打开页面了,这就是默认页面了。部署到 github pages
部署其实很简单,就是修改
hexo
文件的_config.yml
底部的deploy
部署代码。所有上面的东西,部署好之后,就可以进行部署了,我们通过一下
hexo d
命令对github
进行部署。这时候我们的代码就部署到我们的
github
上了。我们可以直接打开链接看一下
<gitname>.github.io
,就可以看到我们部署的项目了,与hexo s
运行结果相同。下载使用 next 主题
我们来下载
next
主题使用方法一更好一些,但是如果就更改内容来说,可能方法二比较方便。
我们使用方法一来实现一次。
我们在修改
_config.yml
中的theme
配置然后我们执行命令,并对 github 进行部署。
我们来看看,我们的成果吧,打开你自己的网页,
username.github.io
。当然,部署命令执行之后,需要等待一会儿,不是马上就有的,如果你需要马上就有,可以执行
hexo s
,先在本地看看是不是成功了。这时候,我们就已经成功了。
但是有许多配置项可能都还不理解,我们进行分篇幅介绍。
我们再来介绍一个命令,如果你的主题是第一种下载方式(
npm install hexo-theme-next@latest
)。使用上面的命令,将主题配置文件,移到根目录下。
我们再来看看现在的文件结构。
可以发现,多出来一个
_config.next.yml
配置文件。我们在里面找到
menu
,然后打开这四个路由在运行,看一下我们首页,就会多出一些标签路由。
当然,除了归档,其他点击都为空路由,因为,我们还没设置这两个文件夹。
这是我们
source
文件夹下,多了两个文件夹。这时候,在打开网站时,就可以打开相关页面了,其他路由同理。
相关文章
Hexo 配置项 NexT 主题各类修改 NexT 主题Gitalk/disqus评论