Local Preview

Local preview lets us see our sections, headers and footers in real-time, as we develop them, without deployment to the server.

Starting the local preview server

To start the local preview server, run the following command:

npx @lightspeed/crane@latest preview

This will start a Vite dev server, which is responsible for displaying sections, headers, and footers. The URL where resources are available is printed in the terminal logs. Open it in a browser, and you will see all the available resources with their corresponding showcases.

Verbose mode

To enable debug logging, use the --verbose flag:

npx @lightspeed/crane@latest preview --verbose

This enables additional debug logs that can help troubleshoot issues during local development.

Hot Reload

The local preview server picks up any changes you make to your sections, headers and footers. It will automatically rebuild the necessary resources and refresh the page. You will see your changes are reflected in real time without any manual rebuilds or refreshes.

Stop the local preview server

Once you are done with development of sections, headers and footers, you can stop the local preview server by pressing Ctrl+C in the terminal where it is running.