Node.js

Mermaid Build

• Check Node.js
  Node.js가 설치되어있다면, npx가 존재
  Node.js가 없다면 설치진행

• Pandoc
  Pandoc is not support mermaid
  Pandoc는 Mermaid가 미지원하므로, 이를 SVG를 변경 후 진행

• All Pandoc need Converting Node.js가 설치되어있으므로 준비
  

  npx --help
  

• Check package.json
  아래와 같이 주석을 사용하면 안됨
  Mkdocs 를 HTML로 변환 후 이를 다시 Electron 으로 이용하여 exe로 Manual 완성
  

  {
    "name": "vscode_doc",
    "version": "1.0.0",
    "description": "MkDocs Electron Viewer",
    "main": "main.js",
    "scripts": {
      "start": "electron .",
      "dist": "electron-builder"
    },
    "devDependencies": {
      "electron": ">=43.2.0",
      "electron-builder": ">=26.0.0"
    },
    "build": {
      "appId": "com.jeonghun.vscode_doc",
      "productName": "vscode docs viewer",
      "directories": {
        "output": "dist"
      },
      "win": {
        "target": "portable"
      }
    }
  }
  

  
  

Convert Mermaid to SVG

• Convert markdown to svg

  npx -p @mermaid-js/mermaid-cli mmdc `
    -i .\docx\mmd\test.md `
    -o .\docx\imgs\test.svg `
    -b transparent
  

  Sample Mermaid
  docx/mmd/test.md

handDrawn Mermaid

• Mermaid 옵션

  %%{init:{
      "look":"handDrawn"
  }}%%

• Mermaid 일반

  npx -p @mermaid-js/mermaid-cli mmdc `
    -i .\docx\mmd\test_general.md `
    -o .\docx\imgs\test_general.svg `
    -b transparent
  

  Sample Mermaid
  docx/mmd/test_general.md

• Mermaid handDrawn

  npx -p @mermaid-js/mermaid-cli mmdc `
    -i .\docx\mmd\test_handdrawn.md `
    -o .\docx\imgs\test_handdrawn.svg `
    -b transparent
  

Sample Mermaid
docx/mmd/test_handdrawn.md