hqit-plugin

library1.2.13jsnpmunverified

hqit-plugin is a Vue.js authentication and dynamic routing plugin (v1.2.13). It provides configurable async route generation based on user permissions fetched from an API, session storage for auth tokens, and responsive base font-size settings. Part of the hqit ecosystem, it integrates with vue-router for login redirection and route guards. Release cadence is low, with niche adoption. Key differentiator: built-in adaptive layout support alongside auth.

security

npm install hqit-plugin

package ↗

INSTALL

IMPORT

SIG · HQIT-PLUGIN

hqit-plugin

securityjavascriptv1.2.13

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.

default

✓ import hqitPlugin from 'hqit-plugin'

✗ const hqitPlugin = require('hqit-plugin')

ESM-only; no CommonJS support.

Vue.use

✓ Vue.use(hqitPlugin, { router, asyncRouterMap, ... })

✗ Vue.use(hqitPlugin)

Requires options object with at least router and asyncRouterMap.

hqitPlugin (config object)

✓ const config = { router, asyncRouterMap, loginPath: '/login', getUser: fetchUser, authoritiesPath: 'data.permissions', authKey: 'hqit_auth', baseSize: 37.5 }; Vue.use(hqitPlugin, config)

✗ Vue.use(hqitPlugin, { loginPath: '/login' })

Missing required fields (router, asyncRouterMap) causes runtime errors.

Shows full Vue plugin setup with dynamic routing, auth API, and adaptive base-size config.

import Vue from 'vue'; import Router from 'vue-router'; import hqitPlugin from 'hqit-plugin'; Vue.use(Router); const router = new Router({ routes: [{ path: '/', component: () => import('./App.vue') }] }); const asyncRouterMap = [ { path: '/admin', component: () => import('./Admin.vue'), meta: { roles: ['admin'] } } ]; async function getUser() { const res = await fetch('/api/user', { headers: { Authorization: `Bearer ${localStorage.getItem('token') ?? ''}` } }); return res.json(); } Vue.use(hqitPlugin, { router, asyncRouterMap, loginPath: '/login', getUser, authoritiesPath: 'data.permissions', authKey: 'hqit_auth', baseSize: 37.5 }); new Vue({ router, render: h => h('div', '') }).$mount('#app');

Debug

Known issues

gotchaMissing required options (router and asyncRouterMap) will cause silent failures or undefined behavior.

fix

Always provide router, asyncRouterMap in the plugin options object.

affects: >=1.0.0

gotchaauthoritiesPath uses dot notation to access nested permissions; wrong path leads to empty permissions and no routes.

fix

Set authoritiesPath to the exact property path returned by getUser, e.g., 'user.roles'.

affects: >=1.0.0

gotchaPlugin expects sessionStorage key authKey to be set manually or via another auth flow; if missing, no auth token is available.

fix

Ensure authKey (default 'hqit_auth') is set in sessionStorage before plugin hooks run, e.g., on login.

affects: >=1.0.0

deprecatedbaseSize option may be removed in future versions in favor of CSS custom properties.

fix

Set baseSize to 37.5 (default) or adapt to upcoming CSS-based approach.

affects: 1.2.x

Errors

Common errors & fixes

TypeError: Cannot read properties of undefined (reading 'addRoutes')

Plugin called Vue.use before router was fully initialized or without passing router option.

fix

Ensure router is created and passed in plugin options: Vue.use(hqitPlugin, { router, ... })

Uncaught (in promise) Error: No permissions found for user

authoritiesPath does not match the actual API response structure.

fix

Inspect API response and set authoritiesPath to the correct nested path, e.g., 'data.roles'.

No matching route found for path '/admin'

User lacks required role in asyncRouterMap meta.roles, or asyncRouterMap not applied.

fix

Verify getUser returns the correct permissions and asyncRouterMap roles are properly assigned.

Upgrade

Version history

1.2.13latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

14 hits · last 30 days

node

Resources

packagehqit-plugin ↗