快速上手
小于 1 分钟
通过安装并启用此插件,你可以在 Markdown 中使用更多的语法。
VuePress 内置的增强功能
VuePress 本身新增了一些 Markdown 语法,详见 官方文档。
树摇
最终输出只会包含你启用功能的代码,所以无需担心你的网站大小。
图表
此插件提供了 6 种方法让你将图表插入到 Markdown 文件中。
Chart.js:一个轻量级、易于使用、高度可定制的图表库。
与 ECharts 相比,Chart.js 更轻量。
ECharts:一个强大的、交互式的浏览器图表和可视化库。
与 Chart.js 相比,ECharts 更强大。
flowchart: Markdown 扩展,用于生成流程图和序列图。
轻量级,只关注流程图。
Markmap: 从 Markdown 生成思维导图
运行环境非常重,不推荐使用。
Mermaid:从 Markdown 生成图表和流程图。
常用图表的强大集合。
Plantuml: 基于 Java 的 UML 图表
没有任何运行时,极其轻量。
Chart.js
一个散点图案例
ECharts
一个折线图案例
流程图
Markmap
Mermaid 图表
Plantuml
代码
此插件提供以下功能来增强代码编写。
- 代码演示:在浏览器中显示和运行代码片段。
- 交互演示:嵌入外部演示站点。
- Kotlin 交互演示:响应式 Kotlin 演示。
- Vue 交互演示:响应式 Vue 演示。
代码演示
一个普通 Demo
<h1>VuePress Theme Hope</h1>
<p><span id="very">非常</span>强大!</p>
document.querySelector("#very").addEventListener("click", () => {
alert("非常强大");
});
span {
color: red;
}
交互演示
Kotlin 交互演示
Kotlin 交互演示
class Contact(val id: Int, var email: String) fun main(args: Array<String>) { val contact = Contact(1, "mary@gmail.com") println(contact.id) }
Vue 交互演示
Vue 交互演示
Sandpack 交互演示
Vue 交互演示
更新日志
2024/12/6 18:48
查看所有更新日志
22787
-于99f51
-于4c6db
-于31f0e
-于913bb
-于f0fcc
-于95198
-于32f93
-于1669d
-于7bc15
-于55ea3
-于539b3
-于7e98c
-于e8287
-于d06e4
-于20520
-于3d95f
-于5e7ca
-于4104e
-于a5112
-于23f74
-于637b2
-于7c8cf
-于2fa50
-于cc653
-于2aeec
-于1d7fa
-于ea4b1
-于099d8
-于062f2
-于fa32a
-于5944a
-于de484
-于d48cc
-于be6e4
-于57c57
-于23515
-于48bca
-于9cdd7
-于63d09
-于ad023
-于ca966
-于88e69
-于fd395
-于1eb1a
-于1d0f9
-于67429
-于4d1ba
-于907b9
-于4a252
-于84de2
-于0d328
-于ced04
-于3b530
-于ace60
-于