Markdown Enhance
VuePress basically generate pages from Markdown files. So you can use it to generate documentation or blog sites easily.
You should create and write Markdown files, so that VuePress can convert them to different pages according to file structure.
Markdown Introduction
If you are a new learner and don't know how to write Markdown, please read Markdown Intro and Markdown Demo.
Markdown Config
VuePress introduce configuration for each Markdown page using Frontmatter.
Info
Frontmatter is a important concept in VuePress. If you don't know it, you need to read Frontmatter Introduction.
Markdown Extension
The Markdown content in VuePress will be parsed by markdown-it, which supports syntax extensions via markdown-it plugins.
VuePress Enhancement
To enrich document writing, VuePress has extended Markdown syntax.
For these extensions, please read Markdown extensions in VuePress.
Theme Enhancement
By using vuepress-plugin-md-enhance
, the theme extends more Markdown syntax and provides richer writing functions.
Custom Container
Safely use {{ variable }} in Markdown.
Custom Title
A custom tip container
Custom Title
A custom warning container
Custom Title
A custom danger container
Custom Title
A custom details container
Tabs
Apple
Banana
Orange
Code Tabs
pnpm add -D vuepress-theme-hope
yarn add -D vuepress-theme-hope
npm i -D vuepress-theme-hope
Superscript and Subscript
19th H2O
Align
I am center
I am right align
Attrs
A word having id.
Footnote
This text has footnote[1].
Mark
You can mark important words .
Tasklist
Image Enhancement
Support setting color scheme and size
Card
Chart
Echarts
Flowchart
Mermaid
Tex
Include files
Code Demo
<h1>VuePress Theme Hope</h1>
<p>Is <span id="very">very</span> powerful!</p>
document.querySelector("#very").addEventListener("click", () => {
alert("Very powerful!");
});
span {
color: red;
}
Stylize
Donate Mr.Hope a cup of coffee.
Playground
Vue Playground
Presentation
This is footnote content ↩︎