vuex-orm-json-api

library1.0.0jsnpmunverified

A JSON:API adapter for Vuex ORM that transforms JSON:API documents into Vuex ORM records, attributes, and relations. Version 1.0.0 (stable). It extends the Vuex ORM Axios plugin with RESTful actions (index, show, create, update, destroy) and handles JSON:API's primary data and included resources via upsert (insertOrUpdate). Key differentiators: automatic relationship resolution, configurable resource-to-entity case conversion, rawRequest API for accessing meta/links, and pass-through axios options. Requires @vuex-orm/core >=0.36.0 and a Vuex ORM Axios plugin. Release cadence is not specified but appears stable.

database

npm install vuex-orm-json-api

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · VUEX-ORM-JSON-API

vuex-orm-json-api

databasejavascriptv1.0.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

VuexOrmJsonApi

✓ import VuexOrmJsonApi from 'vuex-orm-json-api'

✗ const VuexOrmJsonApi = require('vuex-orm-json-api')

Default export for plugin installation. CJS require works but ESM is preferred.

RestfulActionsMixin

✓ import { RestfulActionsMixin } from 'vuex-orm-json-api'

✗ import RestfulActionsMixin from 'vuex-orm-json-api'

Named export; must be destructured.

Model.jsonApi()

✓ User.jsonApi().index()

✗ User.jsonApi().index() // Incorrect: missing method call

jsonApi() is a method on Vuex ORM Model subclasses, not imported separately.

Install the plugin, define a User model, and call RESTful action index() to fetch users from the server.

import axios from 'axios'; import VuexORM from '@vuex-orm/core'; import VuexOrmJsonApi, { RestfulActionsMixin } from 'vuex-orm-json-api'; VuexORM.use(VuexOrmJsonApi, { axios, mixins: [RestfulActionsMixin] }); class User extends VuexORM.Model { static entity = 'users'; static fields() { return { id: this.attr(null), name: this.attr('') }; } } VuexORM.registerEntities({ User }); // Usage example async function fetchUsers() { const users = await User.jsonApi().index(); console.log(users); // array of upserted User records }

Debug

Known issues

gotchaThe jsonApi() method is only available after registering the plugin with VuexORM.use() and including RestfulActionsMixin in mixins option.

fix

Ensure you call VuexORM.use(VuexOrmJsonApi, { axios, mixins: [RestfulActionsMixin] }) before using jsonApi().

affects: >=0.0.0

gotchaJSON:API resource casing conversion defaults to kebab-to-snake for entities; your API must match or config resourceToEntityCase.

fix

Set jsonApiConfig.entityToResourceRouteCase or resourceToEntityCase on your model or during registration.

affects: >=0.0.0

gotchaThe destroy action returns null, not the deleted record. Misunderstanding return value may cause errors.

fix

Do not expect a record from destroy(); it returns null after successful deletion.

affects: >=0.0.0

Errors

Common errors & fixes

Error: VuexORM.use() must be called with a plugin object or function

Importing VuexOrmJsonApi incorrectly (e.g., misspelled or wrong default).

fix

Use 'import VuexOrmJsonApi from 'vuex-orm-json-api'' (default import) and pass as first argument to VuexORM.use().

TypeError: User.jsonApi is not a function

RestfulActionsMixin not included in mixins array during plugin registration.

fix

Add mixins: [RestfulActionsMixin] to the options object passed to VuexORM.use().

Error: Cannot find module 'axios'

Missing axios dependency which is required for HTTP requests.

fix

Install axios: npm install axios

Upgrade

Version history

1.0.0latest on npm

Audit

Dependencies

@vuex-orm/corerequiredPeer dependency required for Vuex ORM model definitions and plugin system.

Agent activity

16 hits · last 30 days

node