#Fast Refresh

Fast Refresh is the default feedback path for React page, layout, and component changes during vext dev.

#What It Handles

Vext keeps the backend process running for frontend-only edits.

#Configuration

export default {
  frontend: {
    dev: {
      hot: true,
      fastRefresh: true,
    },
  },
};

#Fallbacks

Fast Refresh can fall back to a full page reload when:

• a module exports non-component values used outside React
• the update changes document/runtime boundaries
• the file imports server-only code
• the refresh runtime reports an unrecoverable error

The fallback should be clear and recoverable in the browser overlay or terminal.

#Good Component Shape

export function UserCard(props: { name: string }) {
  return <article>{props.name}</article>;
}

Keep service calls in routes and pass data as props. That keeps frontend modules refreshable and safe to bundle.