rebuild-restart-storybook

Source excerpt starting at line 1.

1---2name: rebuild-restart-storybook3description: Rebuild and restart the internal Storybook UI after changes to internal Storybook code (core, addons, frameworks, renderers, libs, etc.), then optionally display a UI review. Use after editing any package in the Storybook monorepo's code/ directory, or when the user asks to rebuild and/or restart Storybook.4allowed-tools: Bash, Read5---6 7# Rebuild and Restart Storybook8 9After making changes to internal Storybook code (core, addons or otherwise), follow this workflow.10 11## Step 1: Ask whether to rebuild and restart (in case of model invocation)12 13Unless the user explicitly ran `/rebuild-restart-storybook`, ask the user whether they want to rebuild and restart Storybook. If they decline, stop here.14 15## Step 2: Determine modified packages16 17Build a space-separated list of the monorepo packages that were modified in the conversation. For each modified package, find its Nx project name in the `project.json` file in that package's directory (the `name` field), not the `package.json` name.18 19For example, if `code/addons/review` and `code/addons/vitest` were modified, the list is `addon-review addon-vitest`.20 21## Step 3: Run the build and start commands in sequence22 23Run these in the `code` directory, in order. Substitute `<extra packages>` with the list from Step 2.24 25```bash26rm -rf node_modules/.cache27yarn28yarn build storybook <extra packages>29```30 31Then, run in the background:32 33```bash34NODE_OPTIONS="--preserve-symlinks" yarn storybook:ui --no-open35```36 37### Handle an occupied port38 39A Storybook may already be running. If the port is occupied, cancel the start, kill the old process to free the port, then start Storybook again.40 41## Step 4: Provide the URL and ask about a review42 43Once Storybook has started, give the user the URL. Then ask whether they want to display a review.44 45## Step 5: Display the review46 47If the user wants a review, use Storybook's `review-create` MCP tool to create a UI review of relevant stories. Pick a set of stories related to the entirety of the conversation so far.48 49If there are no relevant stories because no UI elements were touched, ask the user what they would like to see a review for.50