docs: fix and improve setup and distribution from the October 2026 audit #328

Context

This comes from a code audit of setup and distribution (README, getting-started docs, cli.ts, vite.ts, hub.ts, package.json, the extension manifest), done during a comparison with other devtools in October 2026. Roadmap items live in #310, #311, #312 and #313. Items marked (to confirm) were not reproduced.

Problems

Medium

• devframe installed separately: the install command adds devframe next to the package, which already depends on devframe ^1.2.3. An unpinned devframe can resolve another version, so initDevframe(pangular) mixes two copies. Re-export initDevframe (or a mountPangular() helper) from @pangular-inspector/devtools/devframe and drop devframe from the install command, or move it to peerDependencies with a matching range (README.md:18, apps/docs/src/content/getting-started/installation.md:48-62, installation.md:237-238, packages/devtools/package.json:83).
• one-time code copied by hand: in the client-only setup the CLI prints a localhost:9999/#devframe_otp= link, and the user has to retype the code on the app origin under /__pangular/. Add pangular dev --proxy-origin http://localhost:4200 so startupLines prints the right link. This is a small fix ahead of the builder in phase 3 of 4: a devframe shell as good as Vue and Nuxt DevTools #312 (packages/devtools/src/cli.ts:160-177, installation.md:184-186).

Low

• no dev dependency guidance: README and the docs use a plain install, never -D. Show -D for Vite, Analog and client-only setups, and say that an SSR server needs it as a dependency, or as a dev dependency behind a production guard (README.md:18, installation.md:48-62).
• no supported builder list: the docs say nothing on webpack (@angular-devkit/build-angular:browser), Nx executors or Rsbuild, and /vite is described as "for Analog apps" although it works for any Vite-based Angular app. Add a "Supported setups" table and reword the /vite entry (installation.md:68, apps/docs/src/content/getting-started/vite.md:12).
• full-page viewer path disagrees: "Check that it works" says /__devframes/ and assumes ng serve alone, while the client-only setup on the same page serves it at /__pangular/ with the CLI running. Split the check per setup or name both paths (installation.md:197, installation.md:216-231).
• ssrMiddleware not documented in the Express setup: initPangularHub() returns ssrMiddleware, but "Fill the SSR & HTTP tab" never shows app.use(devtools.ssrMiddleware), so SSR render tracing is easy to miss. Add it there, or mount it inside nodeMiddleware (packages/devtools/src/hub.ts:131, apps/docs/src/content/getting-started/express.md:207-240).
• Node floor above Angular 20: engines.node is >=22, while Angular 20 supports Node ^20.19. Angular 20 users on Node 20 get engine warnings, or a failed install with engine-strict. Test on Node 20.19 and lower the floor, or give the reason in the docs (packages/devtools/package.json:119-121, installation.md:17-18) (to confirm).

Improvements

• vite: print a startup hint ("Pangular Inspector: ", plus the popup shortcut) through server.printUrls, so the devtools URL shows in Vite's banner (packages/devtools/src/vite.ts).
• hub: document how to combine Pangular with other devframe tools in one /__devframes/ dock, and pass extra devframes: [...] through initPangularHub and the Vite plugin (packages/devtools/src/hub.ts, packages/devtools/src/vite.ts, express.md, vite.md).
• cli: add npx @pangular-inspector/devtools init, a codemod for Analog, Nx and non-CLI setups that detects angular.json, vite.config or server.ts and patches them. Offer it as an Nx generator too (packages/devtools/src/cli.ts).
• extension: a standalone read-only mode that works without a server, reading window.ng through devtools.inspectedWindow.eval (extension/).
• docs: a "Supported setups" matrix at the top of installation.md (builder x SSR x transport x extension) with the number of steps each takes, plus short Nx, webpack and Rsbuild notes.

Already tracked elsewhere

• ng add schematic and dev-server builder that mounts the hub: phase 3 of 4: a devframe shell as good as Vue and Nuxt DevTools #312
• Vite plugin overlay injection with transformIndexHtml: phase 1 of 4: safe by default, open in editor and cheap shell wins #310
• Hub enabled switch defaulting off in production: phase 1 of 4: safe by default, open in editor and cheap shell wins #310
• Shared loopback and Host gate for the Express hub: phase 1 of 4: safe by default, open in editor and cheap shell wins #310
• Extension <all_urls> content scripts and the "Host access" docs: phase 1 of 4: safe by default, open in editor and cheap shell wins #310; Chrome Web Store, Edge and Firefox publishing: phase 3 of 4: a devframe shell as good as Vue and Nuxt DevTools #312