Create React Apps

React app components uses Vite by default. You can also use Webpack, ESBuild or other build tools.

An app is a component that can be served, built and deployed. Naturally, apps have dependencies (components and packages) but no dependents. For example, the apps/bit-dev component is an app which uses ui/community-docs.

Create a new app component

Run the following to create an app using your env's component generator:

$bit create react-app apps/my-app --aspect bitdev.react/react-env

Copied

Run the following using the app's component ID to make this app loadable by your workspace:

$bit use apps/my-app

Copied

Run an app

Run the following to list all available apps in your workspace:

$bit app list

Copied

The output lists the IDs of the available app components and their corresponding app names:

┌────────────────────────────────┬──────────┐
│ id │ name │
├────────────────────────────────┼──────────┤
│ my-org.my-scope/apps/my-app │ my-app │
└────────────────────────────────┴──────────┘

Run the following to run an app locally, independent of Bit's dev server:

$bit run my-app

Copied

The output is similar the following (open the listed path and port in your browser, to explore your app):

my-app app is running on http://localhost:3000

Export an app from an existing component

You can turn any Bit component into an app by adding a *.bit-app.ts file to your component. The example below shows a Bit app using the Vite application type:

import { ViteReact } from '@bitdev/react.app-types.vite-react';

export const MyApp = ViteReact.from({
  /**
   * name of your app.
   */
  name: 'my-app',

  /**
   * determine whether to use ssr mode or not.
   */
  ssr: false,
});

export default MyApp;
Copied

Create React Apps

Create a new app component

Run an app

Export an app from an existing component

Learn more