Webflow CLI

The Webflow CLI is the command line interface for developers to interact with Webflow. Use the CLI to manage DevLink by:

• Authenticating with your Webflow workspace or site
• Bundling components into importable libraries
• Exporting components from Webflow
• Importing components into Webflow

You can use the CLI directly in your project or in CI/CD pipelines to automate library imports.

Installation

The Webflow CLI is available as a package on npm. You can install it to your project with the following command:

$
npm install -D @webflow/webflow-cli@latest

DevLink Export requires @webflow/webflow-cli v1.19.0 or later, running on Node.js v22 or higher.

Commands

Export

Export Webflow components to your local React project. The first run walks you through an interactive setup and saves your settings to webflow.json, so subsequent runs — manual or in CI — execute without prompts.

$
webflow devlink export

This command will:

• Authorize the site: The CLI reads WEBFLOW_API_TOKEN from your .env file. If it isn’t set, the CLI opens a browser window for OAuth.
• Resolve the site: The CLI reads siteId from webflow.json (or WEBFLOW_SITE_ID from your .env file as a fallback). If neither is set, the CLI prompts you to pick a site from the workspaces the token can access and writes the choice back to webflow.json.
• Resolve the export configuration: On a first run with no devlink-export: block in webflow.json, the CLI prompts you for each field and writes the result back. On subsequent runs, the saved configuration is reused without prompts.
• Fetch and write components: The CLI exports the components matching your manifest’s components and componentGroups filters and writes them to rootDir (default: ./webflow), along with the DevLinkProvider, generated CSS, and shared modules.

Options

See Configuration options for the full list of webflow.json fields the export reads.

Example: CI/CD usage

In automated workflows, commit your webflow.json and pass the token via environment variable so the export runs unattended:

$
WEBFLOW_API_TOKEN=$WEBFLOW_API_TOKEN webflow devlink export --no-input

Example: Scoped export

To export a subset of components, set the components and/or componentGroups regex filters in webflow.json before running. For example, to export only buttons and cards:

1
{
2
  "siteId": "<your-site-id>",
3
  "devlink-export": {
4
    "rootDir": "./webflow",
5
    "components": "^(Button|Card).*$"
6
  }
7
}

Import

To share your library to your Workspace, use the following command:

$
webflow devlink import

This command will:

• Authorize your workspace: The CLI will check for a Workspace authentication token in your .env file. If one isn’t found, the CLI will prompt you to authenticate by opening a browser window to the Workspace authorization page.
• Bundle your library: The CLI will bundle your library, and ask you to confirm the components you want to share.
• Upload your library to your Workspace

Options

You can use the following options to customize sharing:

Bundle

Bundle your library locally for debugging and testing. The share command automatically bundles your library, but you can use bundle for local development.

$
webflow library bundle --public-path http://localhost:4000/

Options

Log

Get the logs with debug information for your last library import.

$
webflow library log

CI/CD workflows

Use the CLI in automated workflows by adding the --no-input option to avoid interactive prompts.

Important: Implement change detection before sharing to avoid unintentionally removing components:

• Compare current library state with previous import
• Only share when components have actually changed

$
webflow devlink import --no-input

Troubleshooting