Markdown Enhance
- Guide
Every document page in VuePress is rendered by Markdown.
You need to build your document or blog page by creating and writing Markdown in the corresponding path.
Markdown introduction
If you are a new learner and don’t know how to write Markdown, please read Markdown Intro and Markdown Demo.
Frontmatter
Frontmatter is a important concept in VuePress. If you don’t know it, you need to read Frontmatter Introduction.
VuePress enhance
To enrich document writing, VuePress has extended Markdown syntax.
For these extensions, please read Markdown extensions in VuePress.
Theme enhance
Enable all
You can set themeconfig.plugins.htmlEnhance.enableAll
to enable all features of the md-enhance plugin.
module.exports = {
themeConfig: {
plugins: {
mdEnhance: {
enableAll: true,
},
},
},
};
New Feature
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
Code
::: v-pre
Safely use {{ variable }} in markdown.
:::
::: info Custom Title
A custom information container
:::
::: tip Custom Title
A custom tip container
:::
::: warning Custom Title
A custom warning container
:::
::: danger Custom Title
A custom danger container
:::
::: details Custom Title
A custom details container
:::
CodeGroup
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
Footnote
This text has footnote[1].
Mark
You can mark important words .
Tasklist
Chart
Flowchart
Mermaid
Tex
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;
}
Presentation
This is footnote content ↩︎