Refresh

Refreshes the development server when a source file changes.

Add the Refresh component to the root layout of your application to enable hot module replacement when a source file changes:

import { Refresh } from 'renoun/components'

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <body>
        {children}
        <Refresh />
      </body>
    </html>
  )
}

This component only subscribes to the renoun server during development and will return null in production.

API Reference

Refresh

() => Promise<React.JSX.Element | null>

Refreshes the development server when a source file changes.

Returns
Promise<Element | null>