New CLI Commands That Support Vibe Coding

When you vibe code apps and agents with Agentforce Vibes, it completes some of its tasks with Salesforce CLI commands. You can also run these commands yourself at the terminal or command prompt.

Where: These changes apply to Salesforce CLI version 2.124.7 and later.

How: Read the Salesforce CLI weekly release notes or the Salesforce CLI Command Reference for detailed information about these new commands.

New Commands

These new CLI commands generate artifacts such as a UI bundle or FlexiPage.

  • template generate digital-experience site (Developer Preview): Generate an Experience Cloud site.
  • template generate flexipage (Beta): Generate a FlexiPage, also known as a Lightning page.
  • template generate ui-bundle: Generate a UI bundle, which contains the code and metadata to build a UI experience that uses non-native Salesforce frameworks, such as React.
  • ui-bundle dev: Preview a UI bundle locally and in real-time, without deploying it to your org.

Here are some examples.

Generate a React-based UI bundle called MyReactApp in the force-app/main/default/uiBundles directory.

sf template generate ui-bundle --name MyReactApp --template reactbasic --output-dir force-app/main/default/uiBundles

Start a local development server at the specified URL to preview the UI bundle called myBundle.

sf ui-bundle dev --target-org myorg

Generate a RecordPage FlexiPage for the Account object in the force-app/main/default/flexipages directory.

sf template generate flexipage --name Account_Record_Page --template RecordPage --sobject Account --output-dir force-app/main/default/flexipages

New Flags for the template generate project Command

The template generate project command has new flags to support vibe coding apps.

  • --template reactinternalapp or --template reactexternalapp: Template to use for React-based internal or external app project creation.
  • --template agent: Template to use for agent project creation.
  • --lwc-language typescript: Set the language of the Lightning Web Components to TypeScript. If not specified, the default is JavaScript.

Here are some examples.

Generate a React-based DX project that contains scaffolding for external UI bundle use cases.

 sf template generate project --name myreactproject --template reactexternalapp

Generate a standard DX project in which the Lightning Web Components use TypeScript rather than the default JavaScript:

 sf template generate project --name mywork --lwc-language typescript