https://github.com/skirtles-code/vue-vnode-utils
Helpers for manipulating Vue VNodes
https://github.com/skirtles-code/vue-vnode-utils
Last synced: 7 months ago
JSON representation
Helpers for manipulating Vue VNodes
- Host: GitHub
- URL: https://github.com/skirtles-code/vue-vnode-utils
- Owner: skirtles-code
- License: mit
- Created: 2022-10-04T01:19:23.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2025-03-28T14:40:59.000Z (8 months ago)
- Last Synced: 2025-04-15T06:11:46.369Z (7 months ago)
- Language: TypeScript
- Homepage: https://skirtles-code.github.io/vue-vnode-utils/
- Size: 290 KB
- Stars: 21
- Watchers: 1
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-vue - @skirtle/vue-vnode-utils - Helper functions for working with slot VNodes inside render functions in Vue 3 (Components & Libraries / Utilities)
- fucking-awesome-vue - @skirtle/vue-vnode-utils - Helper functions for working with slot VNodes inside render functions in Vue 3 (Components & Libraries / Utilities)
- awesome-vue - @skirtle/vue-vnode-utils - Helper functions for working with slot VNodes inside render functions in Vue 3 (Components & Libraries / Utilities)
README
# @skirtle/vue-vnode-utils
Utilities for manipulating Vue 3 VNodes.
* Docs:
* GitHub:
* Example: [SFC Playground](https://play.vuejs.org/#eNqNVE1vm0AQ/SsjegBLGEirXqidNM2ph0o9VOqhVA0247AN7K52F4fI4r93dmEdmyRVkA+78/XeG545BNdSJvsOgzxY6a1i0oBG08nLgrNWCmXgAAp3MWxFKzuDFQywU6KFkJrCY9FNzZrqhkoER26miiQ9D1scain4VnBtaGJHpWs7Pvqw8FFmsNUU9XhRtID1JXwrTZ20ZR9l8XRmPHITkn3ZdBjDRbZY0JRVOsogAXShYbIpDdINYMU4jYT9shUVNusicP1FAOZRIl15125Q0Z1m0zWzp7Kn0wUdxwnnglwM4AvuhMLxvKrYnhAoYAcCo58VNPXb53AADsMwladUP6Wud4bQLcpsb5RfpUclQRyMS1+2pUz+asHp3R1sXzElCC0HF7Gxz/qeKdNgSttf7jlJX3aGNa6oCGpjpM7TtOPy/i6hpaev1RNTbebBBHW73CjxoFElFe6JTxFYZNI3ENPnBngy2qnF6pdtdYCyqr4rIXUMGzQPiNxNVMhjYPoH9iYm/9BitugTx0mvCXEWxN4BVLgru4aALGdn/OhPTLC6EUbDsPBrVJRSHEYvTjGABsnFHnY9NtEW3MirhIqvruDXbws31qcp/FSlBEO8wRLS1iAl3FrXXN76spORM22RT8UQOUXnfADYDqJxL1P+qGB8Jh11FBJiGMNY9FQx2ZIOx+AJ+euqAlMjhO3j0jEJYduUWoMRUDbNkfgLQvx7PFUwJz+ROyPs5ucniG/l+pWTJY2j69Yd0omH3kX/ozoz2jPG4yTC9L3zpfqGidbgmdn/xPwDpc1jY79OiRc4yt8IVaHK4UL2oEXDKniXZdknm2pLdcd4Dh8p5SP98oFVps7hfZbJ3gUlbZzxO1dHgRHYgQXDPzta8GY=)
## Installation
### npm
Installation with `npm`/`yarn`/`pnpm`:
```sh
npm add @skirtle/vue-vnode-utils
```
ES module usage:
```js
import { addProps } from '@skirtle/vue-vnode-utils'
```
### CDN - global build
```html
```
This should be placed after the `` tag for Vue itself, as it needs the global `Vue` to be available.
The functions are then exposed via the global `VueVNodeUtils`:
```js
const { addProps } = VueVNodeUtils
```
The URL above will include the development build, which is not minified and includes some warning messages. In production the exact version should be pinned and `.prod` should be used instead of `.dev`.
### CDN - ES module build
`@skirtle/vue-vnode-utils` imports from `vue`, so it needs an import map to be configured to use ES modules directly in the browser.
```html
<script type="importmap">
{
"imports": {
"vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js",
"@skirtle/vue-vnode-utils": "https://unpkg.com/@skirtle/vue-vnode-utils/dist/vue-vnode-utils.esm-browser.dev.js"
}
}
import { addProps } from '@skirtle/vue-vnode-utils'
// ...
```
As with the global build, this should be changed to an exact version and switched to `.prod` in production.
Some browsers do not yet have full support for import maps.
## License
MIT
Copyright © 2022-2025, skirtle