vscode為什么畫(huà)不了圖

vscode為什么畫(huà)不了圖

vscode為什么畫(huà)不了圖?

畫(huà)UML圖是基于markdown實(shí)現(xiàn)的。

推薦學(xué)習(xí):vscode教程

準(zhǔn)備環(huán)境

首先要[全局]安裝npm和cnpm。

? ? 由于我在安裝vue的時(shí)候已經(jīng)安裝好了。此處省略

1 通過(guò)vscode安裝 Markdown Preview Enhanced 插件。

? ? 這個(gè)插件提供md文件的預(yù)覽功能。

? ? 右鍵點(diǎn)擊md文件內(nèi)容,然后選擇即可。

2 安裝puppeteer

? ? puppeteer提供導(dǎo)出pdf、html等功能。右鍵預(yù)覽圖片 >> Chrome(Puppeteer) >> PNG即可生成圖片

sudo?cnpm?install?-g?puppeteer

流程圖demo

流程圖

?

```flow st=>start:?流程開(kāi)始 e=>end:?流程結(jié)束 ? op1=>operation:?選手準(zhǔn)備 op2=>operation:?開(kāi)始循環(huán) op3=>operation:?執(zhí)行循環(huán)語(yǔ)句 op4=>operation:?循環(huán)結(jié)束? ? cond1=>condition:?準(zhǔn)備好了么 cond2=>condition:?判斷循環(huán)條件 ? ? st->op1->cond1 cond1(yes,?right)->op2(right)->cond2 cond1(no)->op1 cond2(yes)->op3->cond2 cond2(no)->op4->e

vscode為什么畫(huà)不了圖

關(guān)系圖demo

關(guān)系圖

```mermaid graph?LR ? client1-->|read?/?write|SVN((SVN?server)) client2-->|read?only|SVN client3-->|read?/?write|SVN client4-->|read?only|SVN client5(...)-->SVN SVN---|store?the?data|sharedrive

vscode為什么畫(huà)不了圖

注意:

? ? 關(guān)系圖默認(rèn)的顏色可能很丑,可以修改【用戶(hù)設(shè)置】中的【Mermaid Theme】為【forest】

以上就是

? 版權(quán)聲明
THE END
喜歡就支持一下吧
點(diǎn)贊6 分享