Skip to content

Add Vite → Next.js 16 migration guide#158

Open
policyengine[bot] wants to merge 1 commit into
mainfrom
bot/learnings-qbi-visualizer
Open

Add Vite → Next.js 16 migration guide#158
policyengine[bot] wants to merge 1 commit into
mainfrom
bot/learnings-qbi-visualizer

Conversation

@policyengine

@policyengine policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor

Summary

Documents migration patterns learned from qbi-visualizer PR #23 (Vite → Next.js 16 migration with @policyengine/ui-kit).

Adds comprehensive guide covering:

  • Package dependency migration
  • Directory restructuring (src/pages → src/views to avoid App Router collision)
  • Routing conversion (manual/react-router → filesystem routes)
  • Build configuration (vite.config.ts → next.config.ts + postcss.config.mjs)
  • API proxy migration (Vite server.proxy → Next.js rewrites())
  • Client component boundaries ("use client" directive)
  • Environment variables (VITE_* → NEXT_PUBLIC_*)
  • Styling migration (Tailwind v3 → v4 with ui-kit)
  • Bun lockfile patterns
  • Common gotchas with fixes

Complements the existing policyengine-ui-kit-consumer-skill with a migration path that wasn't previously documented. Future sessions working on similar Vite → Next.js migrations in PolicyEngine repos will benefit from this reference.

Location

skills/frontend/policyengine-ui-kit-consumer-skill/references/vite-to-nextjs-migration.md

Test plan

  • Migration guide references real patterns from qbi-visualizer#23
  • Checklist format matches existing skill structure
  • Links to related skills (ui-kit-consumer, design, interactive-tools)
  • Includes verification checklist
  • Common gotchas section with solutions

🤖 Generated with Claude Code

@PolicyEngine-Bot @claude
Add Vite → Next.js 16 migration guide for ui-kit consumers
d0c8a3a 
Documents migration patterns learned from qbi-visualizer #23:
- Package dependency migration (Vite → Next.js 16 + ui-kit)
- Directory restructuring (src/pages → src/views collision fix)
- Routing conversion (manual/react-router → App Router filesystem)
- Build config migration (vite.config.ts → next.config.ts)
- API proxy migration (Vite server.proxy → Next.js rewrites)
- Client component boundaries ("use client" for interactive views)
- Environment variable renaming (VITE_* → NEXT_PUBLIC_*)
- Styling migration (Tailwind v3 → v4 with ui-kit)
- Bun lockfile patterns in CI
- Common gotchas (window undefined, CSS loading, dynamic imports)

Complements existing ui-kit-consumer skill with framework migration
path that wasn't previously documented.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

28 similar comments
@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

29 similar comments
@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

@policyengine

policyengine Bot commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry @PolicyEngine[bot], only members of the PolicyEngine/core-developers team can invoke Claude Code.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@PolicyEngine-Bot