[Tracking] Vite plugin for Next.js

[vanessayuenn]

RFC

#28428

Milestones

Use this space to document how the project will be split up. At project kickoff, at minimum we should have all the milestones split up, and emphasize which is must-have and which is nice-to-have. As we dig in, flesh out the detailed implementational tasks in each milestone.

Milestone 1: Feature implementation

Beta Give feedback

1. Feature: Support SWC transpiler
2. Feature: Support environment variables
3. Feature: Support various CSS technologies (Global CSS, CSS Modules, External Stylesheets, Tailwind CSS, Sass, CSS-in-JS)
4. Feature: next/link
5. Feature: next/image
6. Feature: next/font
7. Feature: next/head
8. Feature: next/cache
9. Feature: next/navigation
10. Feature: next/router
11. Feature: RSC
12. Mocks: Storybook mocks for Next.js API's

Milestone 2: Releasing and Documentation

Beta Give feedback

1. Testing: Ensure it works in vitest with portable stories
2. Setup CI and Chromatic on example project
3. Publish vite-plugin-storybook-nextjs
4. Telemetry: Add vite-plugin-storybook-nextjs to the list of Test packages #28789
   +0
   
5. Documentation
6. Blog post

Nice to Have

Milestone 3 (Stretch goals)

Beta Give feedback

1. Experimental: @storybook/nextjs-vite #28799
   2 of 2
   +0
2. Feature: Fast-refresh
3. Ensure Windows compatibility

Related issues that may be resolved by this project

Beta Give feedback

1. next/dynamic does not work
2. Refresh bug on startup
3. "Could not find default container" when "waitFor" is used
4. [Bug] Chromatic: Invalid hook call

Decision Records

Record here all the architectural decisions that we make along the way.

⏳ = pending decision
✅ = decision made and recorded