{"id":22318466,"url":"https://github.com/kaishuu0123/vscode-erd","last_synced_at":"2025-07-29T12:31:33.982Z","repository":{"id":33674337,"uuid":"117921124","full_name":"kaishuu0123/vscode-erd","owner":"kaishuu0123","description":"An extension for Visual Studio Code to preview erd(.er) files","archived":false,"fork":false,"pushed_at":"2023-01-07T02:48:26.000Z","size":5130,"stargazers_count":43,"open_issues_count":17,"forks_count":6,"subscribers_count":3,"default_branch":"master","last_synced_at":"2023-03-23T18:22:20.603Z","etag":null,"topics":["dot","erd","erd-preview","visual-studio","vscode-extension"],"latest_commit_sha":null,"homepage":"https://marketplace.visualstudio.com/items?itemName=kaishuu0123.vscode-erd-preview#overview","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kaishuu0123.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-01-18T02:33:35.000Z","updated_at":"2023-03-22T14:28:33.000Z","dependencies_parsed_at":"2023-01-15T02:15:16.787Z","dependency_job_id":null,"html_url":"https://github.com/kaishuu0123/vscode-erd","commit_stats":null,"previous_names":[],"tags_count":null,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kaishuu0123%2Fvscode-erd","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kaishuu0123%2Fvscode-erd/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kaishuu0123%2Fvscode-erd/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kaishuu0123%2Fvscode-erd/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kaishuu0123","download_url":"https://codeload.github.com/kaishuu0123/vscode-erd/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228012200,"owners_count":17855984,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dot","erd","erd-preview","visual-studio","vscode-extension"],"created_at":"2024-12-03T23:13:27.978Z","updated_at":"2024-12-03T23:13:29.075Z","avatar_url":"https://github.com/kaishuu0123.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ERD Preview\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://marketplace.visualstudio.com/items?itemName=kaishuu0123.vscode-erd-preview\"\u003e\n    \u003cimg src=\"https://vsmarketplacebadge.apphb.com/version-short/kaishuu0123.vscode-erd-preview.svg\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://marketplace.visualstudio.com/items?itemName=kaishuu0123.vscode-erd-preview\"\u003e\n    \u003cimg src=\"https://vsmarketplacebadge.apphb.com/downloads-short/kaishuu0123.vscode-erd-preview.svg\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\nAn extension for Visual Studio Code to preview ERD (Entity-relationship diagram) files.\n\n\n[ERD Preview - Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=kaishuu0123.vscode-erd-preview#overview)\n\n[github.com/kaishuu0123/vscode-erd](https://github.com/kaishuu0123/vscode-erd/)\n\n## Preview\n\n![Preview](https://github.com/kaishuu0123/vscode-erd/raw/master/vscode-erd-demo.gif)\n\n## Configuration\n\nMake sure the extension can find the \"erd\" and \"dot\" program. \u003cbr/\u003e\nYou can set `erd-preview.erdPath` and `erd-preview.dotPath` option. \u003cbr/\u003e\nPlease edit settings.json. ([File] -\u003e [Preference] -\u003e [Settings])\n\n## Requirements\n\nUse this extension require `erd` and `dot` command.\n\nYou can get `erd` command here.\n\n* Single binary my project\n    * https://github.com/kaishuu0123/erd-go/releases\n* BurntSushi erd\n    * https://github.com/BurntSushi/erd\n\nYou can get `dot` command here.\n\n* Single binary my project\n    * https://github.com/kaishuu0123/graphviz-dot.js/releases\n* Official Graphviz dot command\n    * http://www.graphviz.org/download/\n\n## Usage\n\nPreview\n\n1. write erd file ( example: https://github.com/kaishuu0123/erd-go/blob/master/examples/simple.er )\n1. Press `Ctrl+Shift+p` (windows) or `Command+Shift+p` (Mac) and select `ERD: Preview Current Window\"`\n\nExport to file\n\n1. Press `Ctrl+Shift+p` (windows) or `Command+Shift+p` (Mac) and select `ERD: Save as SVG` or `ERD: Save as PNG` or `ERD: Save as PDF`.\n\n## Setup\n### Windows\n\n1. Download erd-go from https://github.com/kaishuu0123/erd-go/releases.\n   * Destination directory Example\n   * `C:\\Users\\(user name)\\Tools\\windows_amd64_erd-go.exe`\n2. Download dot program from https://github.com/kaishuu0123/graphviz-dot.js/releases\n   * Destination directory Example\n   * `C:\\Users\\(user name)\\Tools\\graphviz-dot-win-x64.exe`\n   * When you want to use png output\n     * Install graphviz\n     * https://www.graphviz.org\n3. edit vscode settings.json\n    ```json\n    {\n        \"erd-preview.erdPath\": \"C:\\\\Users\\\\(user name)\\\\Tools\\\\windows_amd64_erd-go.exe\",\n        \"erd-preview.dotPath\": \"C:\\\\Users\\\\(user name)\\\\Tools\\\\graphviz-dot-win-x64.exe\",\n    }\n    ```\n    * When uou want to use png output\n      * Please search dot.exe program path.\n      * ex.) C:\\Program Files(x86)\\Graphviz2.30\\bin\\dot.exe\n\n### MacOSX\n#### Use binary\n\n1. Download erd-go from https://github.com/kaishuu0123/erd-go/releases.\n   * Destination directory Example\n   * `/Users/(user name)/tools/darwin_amd64_erd-go`\n2. Download dot program from https://github.com/kaishuu0123/graphviz-dot.js/releases\n   * Destination directory Example\n   * `/Users/(user name)/tools/graphviz-dot-macos-x64`\n   * When you want to use png output\n     * Install graphviz\n     * https://www.graphviz.org\n3. edit vscode settings.json\n    ```json\n    {\n        \"erd-preview.erdPath\": \"/Users/(user name)/tools/darwin_amd64_erd-go\",\n        \"erd-preview.dotPath\": \"/Users/(user name)/tools/graphviz-dot-macos-x64\",\n    }\n    ```\n    * When uou want to use png output\n      * Please search dot command path.\n\n#### Use homebrew\n1. Install erd-go from homebrew\n   ```shell\n   $ brew tap kaishuu0123/erd-go\n   $ brew install erd-go\n\n   # install check\n   $ erd-go\n   ```\n2. Install dot program(graphviz) from homebrew\n   ```shell\n   $ brew install graphviz\n\n   # install check\n   $ dot\n   ```\n3. Install this extention to Visutal Studio Code.\n\n### Linux\n\n1. Download erd-go from https://github.com/kaishuu0123/erd-go/releases.\n   * Destination directory Example\n   * `/home/(user name)/tools/linux_amd64_erd-go`\n2. Download dot program from https://github.com/kaishuu0123/graphviz-dot.js/releases\n   * Destination directory Example\n   * `/Users/(user name)/tools/graphviz-dot-linux-x64`\n   * When you want to use png output\n     * Install graphviz\n     * https://www.graphviz.org\n3. edit vscode settings.json\n    ```json\n    {\n        \"erd-preview.erdPath\": \"/home/(user name)/tools/linux_amd64_erd-go\",\n        \"erd-preview.dotPath\": \"/Users/(user name)/tools/graphviz-dot-linux-x64\",\n    }\n    ```\n    * When uou want to use png output\n      * Please search `dot` command path.\n\n## Development\n\n* Clone this repo.\n\n```\n$ git clone git@github.com:kaishuu0123/vscode-erd.git\n```\n\n* Open by vscode\n\n```\n$ cd vscode-erd\n$ code .\n```\n\n* Press F5 Key\n\n## Credits\n\nThis work is based off of several existing projects:\n\n* https://github.com/qjebbs/vscode-plantuml\n* https://github.com/vitaliymaz/vscode-svg-previewer\n\n## Known Issues\n\n* https://github.com/kaishuu0123/vscode-erd/issues\n\n## Release Notes\n\n* https://github.com/kaishuu0123/vscode-erd/releases\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkaishuu0123%2Fvscode-erd","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkaishuu0123%2Fvscode-erd","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkaishuu0123%2Fvscode-erd/lists"}