框架使用简要说明
前言
使用此框架书写文档时,推荐大家使用markdown进行,有利于保持较高的一致性,可阅读性,提高阅读效率
同时makrdown语法也十分的简单
教程地址: https://www.runoob.com/markdown/md-tutorial.html
推荐的markdown编辑软件:typora(点击访问官网) ,当然现在大部分编辑器例如VSCode都是支持打开编辑markdown文件的也支持实时预览。
安装
下载仓库
全局安装hexo
npm i -g hexo
然后在项目内
npm i
安装相关依赖
注意:hexo可以不全局安装 但后续执行任何hexo相关命令时需要加上npx
例如 npx hexo s
否则会提示hexo不是’hexo’ 不是内部或外部命令,也不是可运行的程序或批处理文件。(这个其他插件都同理,例如未全局安装vue的话也可以 npx+vue执行vue相关命令)
启动项目命令
hexo s
启动完毕后命令行会输出启动服务地址 默认为http://localhost:4000
生成文档命令
hexo new -p 生成路径/文件名 文件名
示例:
hexo new -p 插件文档/生成测试.md 生成测试
-p后边跟的是想生成到的路径跟文件名 后边再重复一次文件名
执行完毕后会在相应的目录生成此文件跟一个与文件同名的文件夹,相关的图片资源等放到此文件夹内,用相对路径引用即可
编辑文档
推荐使用typora
进行markdown文件的编辑
打开刚刚的新文件是一个包含此头部(示例)的markdown文件
---
title: 示例
date: 2020-11-30 16:13:18
updated: 2020-11-30 16:13:18
author:
---
别忘记自行修改下author
(作者)
如果想要置顶的话可以在这里加一个top: true
(只能有一篇文章置顶,如果有多篇文章包含此变量的话按排序取第一篇置顶,默认按日期倒序,即后写的在前)
如果不想用命令的话也可以自行新建文件,但需要自行复制一个文件头在自己的文件内,不然运行时候会报错
文件头位置 /scaffolds/post.md
无论是什么格式的都得在文件最上部加上此头部 头部的 title跟文件名保持一致
插入资源说明
将图片复制到文件生成时创建的同名目录用相对路径引用即可
如果是使用typora
编辑的话简单很多,改动设置之后直接拖到图片到文档中即可完成插入,typora
会自动帮你完成复制图片这一步骤。
设置方法如下
在typora
主界面选择 文件 –> 偏好设置 然后将子选项改动到与下图一致就行
进阶用法可以查看 hexo文档中的 标签插件(点击前往文档)
预览
编辑文件时运行hexo s
启动服务即可, 服务器会实时更新你所编辑的内容,编辑完手动刷新即可看到你刚输入的文字
想要预览生成的结构跟文件的话运行hexo g
即可生成public
目录,运行hexo clean
即可清理
项目部署
将项目上传至码云仓库后,到如下界面 ,点击服务,选择Gitee Pages;
点击启动/更新/部署(按钮根据状态不同显示不同),等待部署完成即可。
附录
本站主要框架文档
相关命令可以直接查阅文档
hexo所支持的模板插件
live2d(左下角看板娘) 模型切换方法
npm i --save 模型名称
然后修改model.user
即可