Frameworks
Domscribe provides first-class integrations for popular frontend frameworks. Each integration includes build-time AST transformation for stable data-ds attributes and runtime adapters for deep context capture (props, state, component trees).
Supported Frameworks
| Framework | Versions | Package | Guide |
|---|---|---|---|
| React | 18 - 19 | @domscribe/react | React Guide |
| Vue | 3+ | @domscribe/vue | Vue Guide |
| Next.js | 15 - 16 | @domscribe/next | Next.js Guide |
| Nuxt | 3+ | @domscribe/nuxt | Nuxt Guide |
Bundler Support
All framework integrations work with the following bundlers:
| Bundler | Versions |
|---|---|
| Vite | 5 - 7 |
| Webpack | 5 |
| Turbopack | Latest (via Next.js) |
The Next.js integration supports both Webpack and Turbopack automatically through the withDomscribe() config wrapper. React and Vue integrations ship separate Vite and Webpack plugin exports.
Base Transform Package
If you are using a framework that does not have a dedicated integration, you can use @domscribe/transform directly. This gives you DOM-to-source mapping via data-ds attributes but without runtime context capture (no props or state extraction).
npm install -D @domscribe/transform
See the React or Vue guides for examples of Vite and Webpack plugin configuration patterns that apply to the base transform package as well.
Custom Adapters
Domscribe's runtime is built on an extensible FrameworkAdapter interface. You can add support for any component-based framework -- Svelte, Angular, Solid, Lit, or your own.
See the Custom Adapters guide for the full interface specification, a minimal example, and implementation guidelines.