Skip to main content
Use Agent Skills

Prefer to scaffold via your AI agent? See Agent Skills and run /data-client-setup.

Add provider at top-level component​

Install the Vue plugin when creating your app.

npm install --save @data-client/vue @data-client/rest
main.ts
import { createApp } from 'vue';
import { DataClientPlugin } from '@data-client/vue';

const app = createApp(App);

app.use(DataClientPlugin, {
  // optional overrides
  // managers: getDefaultManagers(),
  // initialState,
  // Controller,
  // gcPolicy,
});

app.mount('#app');
Next: Define Data »

Example​

More Demos

Supported Tools​

TypeScript 3.7+

TypeScript is optional, but requires at least version 3.7 and strictNullChecks for full type enforcement.

Older browser support

If your application targets older browsers (a few years or more), be sure to load polyfills. Typically this is done with @babel/preset-env useBuiltIns: 'entry', coupled with importing core-js at the entrypoint of your application.

This ensures only the needed polyfills for your browser support targets are included in your application bundle.

For instance TypeError: Object.hasOwn is not a function

Internet Explorer support

If you see Uncaught TypeError: Class constructor Resource cannot be invoked without 'new', follow the instructions to add legacy browser support to packages

Vue 3

@data-client/vue supports Vue 3 and is built on the Composition API.