VuePress で markdown-it-fontawesome
Font Awesomeの使い方は公式ドキュメントの記載通り。markdown-it-fontawesomeで Markdown で使えるようにする。
インストールと設定
yarn add --dev markdown-it-fontawesome
1
docs/.vuepress/config.js
module.exports = {
markdown: {
config: md => {
md.use(require('markdown-it-fontawesome'))
}
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
CSS の読み込み
すべてのページに適用する場合は、config.js に書く。他の方法として、SVG や Component(Vue,React)でも使える。
docs/.vuepress/config.js
module.exports = {
head: [
[
'link',
{
rel: 'stylesheet',
href: 'https://use.fontawesome.com/releases/v5.0.13/css/all.css',
integrity: 'sha384-xxx',
crossorigin: 'anonymous'
}
]
]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
表示確認
Hello World!
Hello World! :fas-flag:
1