搭建docusaurus博客
搭建docusaurus博客:
docusaurus是facebook的开源的用于简化构建,部署,和维护的博客网站.
- 特点:
- 快速启动
- 支持本地化
- 页面可自定义
- 安装要求:
Node >= 8.x,官方推荐同时安装Yarn,或许是因为yarn安装比较方便吧,如果Yarn安装版本要 >= 1.5
Node安装地址: https://nodejs.org/en/download/
Yarn安装地址: https://yarnpkg.com/en/docs/install
- 安装
1 创建项目根目录
2 在项目根目录执行命令
npx docusaurus-init
.注意docusaurus-init后面的英文句号,代表本路径的意思.
- docusaurus项目结构介绍
docs-examples-from-docusaurus:显示文档模板,里面是页面显示的文档内容
website:显示站点内容及配置
blog-examples-from-docusaurus:博客内容模板文件夹,里面放置你的博客
core/Footer.js: 定义页脚显示内容
i18n:本地化配置
pages/en/index.js:首页显示内容
static:页面静态文件路径
sidebars.json: 定义显示docs内容
siteConfig.js: 网站核心配置文件
- 修改文件目录
项目初始化时,为了便于识别标明了模板目录,但是实际使用时需要修改这些模板目录名称
docs-examples-from-docusaurus -> docs 需要将blog-examples-from-docusaurus改名为docs
blog-examples-from-docusaurus -> blog 需要将blog-examples-from-docusaurus改名为blog
- 使用示例
- 1. 增加首页显示文档
在docs目录下增加newfile.md文件
---
id: newfileid
title: 我是一个新文件
---新文件内容,从前有座山..
- 2.在sidebar.json中配置自己的newfile.md
{
"docs": {
"Docusaurus": ["doc1"],
"First Category": ["doc2"],
"Second Category": ["doc3"],
"我是新文件": ["newfileid"]
},
"docs-other": {
"First Category": ["doc4", "doc5"]
}
}
- 3.在website目录下启动项目即可
npm start
- 恭喜你,有了自己的博客网站
- 参考资料:
https://docusaurus.io/docs/en/installation
最新文章
- 原生js事件和jquery事件的执行顺序问题
- 关于隐藏input输入内容问题
- ASP.NET MVC应用require.js实践
- Resource interpreted as Script but transferred with MIME type text/plain:
- PostgreSQL/bin
- C#程序实现动态调用DLL的研究[转]
- 代码实现IMapcontrol当前视图输出为图片功能
- oracle数据库不支持mysql中limit功能
- RPM vs SRPM
- 模板-->;中国剩余定理[互质版本]
- vijosP1499炸毁燃料库
- ping网络故障
- ARP网关占用
- linux优化项
- jQuery ajax方法success()中后台传来的四种数据类型
- 用post请求方式实现对地图服务的基本操作
- HDU 4135 Co-prime (容斥+分解质因子)
- springboot项目中jdk版本的问题
- C++之单例类模板
- QoS 服务质量