{"id":41235,"library":"hqit-plugin","title":"hqit-plugin","description":"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.","status":"active","version":"1.2.13","language":"javascript","source_language":"en","source_url":null,"tags":["javascript"],"install":[{"cmd":"npm install hqit-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add hqit-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add hqit-plugin","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"ESM-only; no CommonJS support.","wrong":"const hqitPlugin = require('hqit-plugin')","symbol":"default","correct":"import hqitPlugin from 'hqit-plugin'"},{"note":"Requires options object with at least router and asyncRouterMap.","wrong":"Vue.use(hqitPlugin)","symbol":"Vue.use","correct":"Vue.use(hqitPlugin, { router, asyncRouterMap, ... })"},{"note":"Missing required fields (router, asyncRouterMap) causes runtime errors.","wrong":"Vue.use(hqitPlugin, { loginPath: '/login' })","symbol":"hqitPlugin (config object)","correct":"const config = { router, asyncRouterMap, loginPath: '/login', getUser: fetchUser, authoritiesPath: 'data.permissions', authKey: 'hqit_auth', baseSize: 37.5 }; Vue.use(hqitPlugin, config)"}],"quickstart":{"code":"import Vue from 'vue';\nimport Router from 'vue-router';\nimport hqitPlugin from 'hqit-plugin';\n\nVue.use(Router);\n\nconst router = new Router({\n  routes: [{ path: '/', component: () => import('./App.vue') }]\n});\n\nconst asyncRouterMap = [\n  { path: '/admin', component: () => import('./Admin.vue'), meta: { roles: ['admin'] } }\n];\n\nasync function getUser() {\n  const res = await fetch('/api/user', { headers: { Authorization: `Bearer ${localStorage.getItem('token') ?? ''}` } });\n  return res.json();\n}\n\nVue.use(hqitPlugin, {\n  router,\n  asyncRouterMap,\n  loginPath: '/login',\n  getUser,\n  authoritiesPath: 'data.permissions',\n  authKey: 'hqit_auth',\n  baseSize: 37.5\n});\n\nnew Vue({\n  router,\n  render: h => h('div', '')\n}).$mount('#app');","lang":"javascript","description":"Shows full Vue plugin setup with dynamic routing, auth API, and adaptive base-size config."},"warnings":[{"fix":"Always provide router, asyncRouterMap in the plugin options object.","message":"Missing required options (router and asyncRouterMap) will cause silent failures or undefined behavior.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Set authoritiesPath to the exact property path returned by getUser, e.g., 'user.roles'.","message":"authoritiesPath uses dot notation to access nested permissions; wrong path leads to empty permissions and no routes.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Ensure authKey (default 'hqit_auth') is set in sessionStorage before plugin hooks run, e.g., on login.","message":"Plugin expects sessionStorage key authKey to be set manually or via another auth flow; if missing, no auth token is available.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Set baseSize to 37.5 (default) or adapt to upcoming CSS-based approach.","message":"baseSize option may be removed in future versions in favor of CSS custom properties.","severity":"deprecated","affected_versions":"1.2.x"}],"env_vars":null,"search_vec":"'adapt':71 'adopt':65 'alongsid':74 'api':29 'async':19 'auth':33,75 'authent':10 'base':22,37 'built':69 'built-in':68 'cadenc':60 'configur':18 'differenti':67 'dynam':12 'ecosystem':46 'fetch':26 'font':39 'font-siz':38 'generat':21 'guard':58 'hqit':2,5,45 'hqit-plugin':1,4 'integr':48 'javascript':76 'key':66 'layout':72 'login':54 'low':62 'nich':64 'part':42 'permiss':25 'plugin':3,6,14 'provid':17 'redirect':55 'releas':59 'respons':36 'rout':13,20,57 'router':52 'session':30 'set':41 'size':40 'storag':31 'support':73 'token':34 'user':24 'v1.2.13':15 'vue':51 'vue-rout':50 'vue.js':9","created_at":"2026-06-04T18:51:25.345513+00:00","updated_at":"2026-06-04T18:51:25.345513+00:00","problems":[{"fix":"Ensure router is created and passed in plugin options: Vue.use(hqitPlugin, { router, ... })","cause":"Plugin called Vue.use before router was fully initialized or without passing router option.","error":"TypeError: Cannot read properties of undefined (reading 'addRoutes')"},{"fix":"Inspect API response and set authoritiesPath to the correct nested path, e.g., 'data.roles'.","cause":"authoritiesPath does not match the actual API response structure.","error":"Uncaught (in promise) Error: No permissions found for user"},{"fix":"Verify getUser returns the correct permissions and asyncRouterMap roles are properly assigned.","cause":"User lacks required role in asyncRouterMap meta.roles, or asyncRouterMap not applied.","error":"No matching route found for path '/admin'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":null,"github":null,"docs":null,"changelog":null,"pypi":null,"npm":"hqit-plugin","openapi_spec":null,"status_page":null,"smithery":null,"categories":["security"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-04","next_check":"2026-09-02","install_tag":null}}