lightning dev component
Preview LWC components in isolation.
Component preview launches an isolated development environment for Lightning Web Components, enabling rapid iteration without needing to deploy changes. The server provides real-time previews of your components through hot module replacement (HMR), automatically refreshing the view when source files are modified.
When running the development server, these changes are immediately reflected:
- Component template (HTML) modifications
- Styling updates in component CSS files
- JavaScript logic changes that don't modify the component's API
- Adding or updating internal component dependencies
- Modifying static resources used by the component
If you run the command without flags, it displays a list of components that it found in your local DX project for you to choose to preview. Use the –name flag to bypass the question. The command also asks if you want to enable Local Dev in your org if it isn’t already.
See the LWC Developer Guide for more information about component development best practices and limitations (https://developer.salesforce.com/docs/platform/lwc/guide/get-started-best-practices.html).
| Flag Name (Long) | Flag Name (Short) | Description |
|---|---|---|
‑‑api‑version | N/A | Type: Value Override the api version used for api requests made by this command |
‑‑client‑select | ‑c | Type: Boolean Launch component preview without selecting a component. |
‑‑flags‑dir | N/A | Type: Value Import flag values from a directory. |
‑‑json | N/A | Type: Boolean Format output as json. |
‑‑name | ‑n | Type: Value Name of a component to preview. |
‑‑target‑org | ‑o | Type: Value Required Username or alias of the target org. Not required if the target-org configuration variable is already set. |
Select a component interactively and launch the component preview; use your default org:
Launch component preview for “myComponent”; use the org with alias “myscratch”: