# @antv/x6-vue-shape

> X6 shape for rendering vue components.

Latest version **3.0.2** (published 2025-12-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install @antv/x6-vue-shape
pnpm add @antv/x6-vue-shape
yarn add @antv/x6-vue-shape
bun add @antv/x6-vue-shape
```

## Health

**Score 60/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 3.0.2 |
| Published | 2025-12-01 |
| First published | 2020-12-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 701.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 6753 |
| Author | bubkoo |
| Maintainers | lvisei, freestyle21, soundquiet, elaine.q.10, sturuby, sakuya223, serializedowen, xdzhao, yangzhanmei, wjgogogo, leungwensen, dori, iaaron, yard, simaq, dxq613, intchous, susan_ann, jinke.li, lzxue, army8735, atool, baizn, dengfuping, neoddish, jeffy2012, zqlu, afc163, pomelo-nwu, kopiluwaky, ccnuzindex, panyuqi, bubkoo, zengyue, kasmine, boyu.zlj, l1ud0ngq1, newbyvector, winniexing, chenluli, kn9117, xdddst, semious2020, esora, nadia_liu, bbsqq, mxz96102, openwayne, pearmini, pddpd, yiqianyao, zhanba, cxxxxxn, laixingui.lxg, susiwen8, yanxiong, zeyuwang, rainy25ghz, zhangjunjie-loki, flash1, yisi.wang, dreammy23, biupiubiupiu, basketduck, xuying1027, banxuan, bqxbqxbqx, duxinyue023, wang1212, leondt1, gaofuhong |
| Keywords | shape, vue, render, x6, antv |

## Links

- npm: https://www.npmjs.com/package/@antv/x6-vue-shape
- Repository: https://github.com/antvis/x6
- Homepage: https://x6.antv.antgroup.com/tutorial/intermediate/vue
- Issues: https://github.com/antvis/x6/issues
- npm.io page: https://npm.io/package/@antv/x6-vue-shape

## Dependencies (1)

- [vue-demi](https://npm.io/package/vue-demi.md) latest

## Recent versions

- 3.0.2 (latest) — 2025-12-01
- 2.0.0-beta.1 (beta) — 2022-11-15
- 3.0.1 — 2025-11-27
- 2.1.2 — 2024-01-26
- 2.1.1 — 2023-07-12
- 2.0.11 — 2023-04-12
- 2.0.10 — 2023-03-12
- 1.5.4 — 2023-02-22
- 2.0.9 — 2022-12-21
- 2.0.8 — 2022-12-20
- 2.0.7 — 2022-12-09
- 2.0.6 — 2022-12-05
- 2.0.5 — 2022-11-28
- 2.0.4 — 2022-11-28
- 2.0.3 — 2022-11-25
- … 69 more at https://npm.io/package/@antv/x6-vue-shape/versions

## README

# @antv/x6-vue-shape

> x6 shape for rendering vue components

## Installation

```shell
# npm
$ npm install @antv/x6-vue-shape --save

# yarn
$ yarn add @antv/x6-vue-shape
```

## Usage

```ts
import { Graph } from '@antv/x6'
import '@antv/x6-vue-shape'
import HelloWord from './HelloWord.vue'

// render
graph.addNode({
  shape: 'vue-shape',
  x: 32,
  y: 48,
  width: 180,
  height: 40,
  component: {
    template: `<hello-world :name="name"></hello-world>`,
    data() {
      return {
        name: 'x6',
      }
    },
    components: {
      HelloWorld,
    },
  },
})
```

---
_Source: https://npm.io/package/@antv/x6-vue-shape · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._