# AyaNova v8 front end — instructions for Claude Code Shared AyaNova context and working rules, from the server repo (the master): @../raven/CLAUDE.md Everything below is specific to this repo. ## What this is The AyaNova v8 web client, in `ayanova/`. Vue 2.6, Vuetify 2.6, Vuex, Vue Router, plain JavaScript (no TypeScript), Vue CLI 4 / webpack 4. Stack details: `../raven/devdocs/modernization/CODEBASE-REFERENCE.md`. ## Release 8.3.0 The .NET 10 port is merged into `main` here too (2026-10-23); its only client changes were the version bump and the Sass `quietDeps` build setting. Release work continues on `main`. **No changes in this repo** unless John asks. A "next release" case that touches the client gets its own commits on `main`, under its own case number. ## Constraints - **Node.js 12.22.9 exactly.** `fibers` breaks on anything newer. Check with `node -v` before building. - **No dependency changes**: no `npm install `, no `npm update`, no version edits in `package.json`. Front-end upgrades are roadmap step F, not current work. - Install with `npm ci` (exact versions from `package-lock.json`), never `npm install`. - Vue 2 / Vuetify 2 are end of life. Do not upgrade them, and do not write Vue 3 style code. - Add `data-testid` attributes to elements that Cypress tests select. ## Commands ```powershell cd ayanova npm ci # first time, or after package-lock.json changes npm run serve # dev server with hot reload npm run build # production build into dist\ npm run lint ``` ## How the build reaches the server `npm run build` writes to `ayanova\dist\`. `raven\build-release.bat` (or `buildrelease.bat` here) copies it into `raven\server\AyaNova\wwwroot\`. The .NET build does not produce `wwwroot`: whatever is there when the server is published is what ships. Webpack content-hash file names (`app..js` …) change on every build even when the contents do not. Compare file contents, not names. Warnings on every build that are harmless: Browserslist "caniuse-lite is outdated"; Dart Sass division deprecation (from Vuetify); asset size (Monaco's workers). ## Code layout `src/api/` API utilities, auth and error handling; `src/components/` about 80 components; `src/views/` about 100 pages; `src/plugins/` Vuetify setup; `router.js`, `store.js`, `main.js`, `App.vue`. View prefixes: `acc-` accounting, `adm-` administration, `cust-` customers, `home-` dashboard, `inv-` inventory, `ops-` server operations, `svc-` service (work orders, quotes, PMs).