CLI

WebComponents.dev comes with a CLI for local development.

Usage

npx {{ cliName }}@latest

We recommend the use of npx and @latest in order to always run the latest version of the CLI. With this command you never need to upgrade WebComponents.dev's CLI.

Use npx wcd-cli@latest --help to have the latest options and commands details.

Commands

serve

Renders a project from your local file system.

Use npx wcd-cli@latest serve --help to explore all options.

Similar to export, but calls npm link under the hood.

Use npx wcd-cli@latest link --help to explore all options.

The main purpose is to put the package in node_modules and test in your app without the need to release it.

Check "Open Link details" button in the top-right corner in WebComponents.dev to find the current --branch value or to copy the entire command.

checkout

Checkouts an existing project locally.

An intended use case is to start working locally on an existing project in combination with the serve command, but it may be used in other situations as it also allows you to get the compiled output of your project with the --compile parameter.

Pay attention that --branch option is not just a branch name, but depends on what type of branch it is (default, live or local) and must include the branch creator ID if present. Check "Open Link details" button in the top-right corner in WebComponents.dev to find the current --branch value.

Use npx wcd-cli@latest checkout --help to explore all options.

export

DEPRECATED: Use checkout instead

Compiles a WebComponents.dev project branch and copies the result to a local folder.

Similarly to checkout the branch name is not just the display name. Check checkout documentation for more details.

Use npx wcd-cli@latest export --help to explore all options. Has --source-only option to export just the sources. This is useful if you didn't connect your project to source control and want to get your raw files locally.