React Component Generators

Component generators enable you to easily create new components. Generators include boilerplate code as well as configs, such as default env to be set for the component.

To add templates from your React dev environment to a workspace, add your env to the generator section in `workspace.jsonc`:

{
  "teambit.generator/generator": {
    "envs": ["my-org.my-scope/envs/my-react-env"]
  }
}
Copied

Run the following to list the available component templates for react-env:

$bit templates

Copied

You should see the following templates - note the output includes the env they are associated with:

Use bit create with any template to generate a new component:

$bit create react name/spaces/my-react

Copied

You can also create your own component generators, and expose them via your custom env.

To create your own custom generators, we recommend starting by forking the default React generator component:

$bit fork bitdev.react/generators/react-starters generators/my-react-env-generators

Copied

See the Create Component Generators section for more information on creating custom generators.

Once your generators are ready, ensure to import your custom templates and register them to your env:

// my-react-env-env.bit-env.ts
import { MyReactEnvGenerator } from '@my-org/my-scope.generators.my-react-env-generator';

export class MyReactEnv extends ReactEnv {
  generators() {
    return TemplateList.from([
      MyReactEnvGenerator.from(),
    ]);
  }
Copied