> ## Documentation Index
> Fetch the complete documentation index at: https://extension.js.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Create command to scaffold extension projects

> Scaffold a new browser extension project from an official template with one CLI command. Choose React, Vue, Svelte, TypeScript, or vanilla JS.

`create` scaffolds files, configuration, and starter scripts for the selected template and optionally installs dependencies.

## When to use `create`

* Start a new extension from scratch.
* Spin up multiple proof-of-concept ideas quickly.
* Standardize onboarding for your teammates with consistent template defaults.

## Create command capabilities

| Capability           | What it gives you                                           |
| -------------------- | ----------------------------------------------------------- |
| Template scaffolding | Start with official templates and a ready project structure |
| Dependency install   | Optionally install required packages after scaffold         |
| Path flexibility     | Create by project name or explicit folder path              |
| Fast onboarding      | Move from empty folder to runnable extension quickly        |

## Usage

<CodeGroup>
  ```bash npm theme={null}
  npx extension@latest create <extension-name|extension-path> [options]
  ```

  ```bash pnpm theme={null}
  pnpx extension@latest create <extension-name|extension-path> [options]
  ```

  ```bash yarn theme={null}
  yarn dlx extension@latest create <extension-name|extension-path> [options]
  ```

  ```bash bun theme={null}
  bunx extension@latest create <extension-name|extension-path> [options]
  ```

  ```bash deno theme={null}
  deno run -A npm:extension@latest create <extension-name|extension-path> [options]
  ```
</CodeGroup>

## Arguments and flags

| Flag                  | Alias | What it does                             | Default      |
| --------------------- | ----- | ---------------------------------------- | ------------ |
| `[path or name]`      | -     | Project folder/name to create.           | required     |
| `--template <name>`   | `-t`  | Sets the template slug.                  | `javascript` |
| `--install [boolean]` | -     | Installs dependencies after scaffolding. | `false`      |

When you want the default JavaScript starter, omit `--template` entirely. Add `--template=<slug>` only for another stack from the [official examples](https://github.com/extension-js/examples/tree/main/examples).

The slug `init` is an alias for the same default starter. Only use a literal slug named `default` if that folder actually exists in the examples repository.

## Shared global options

Also supports [Global flags](/docs/workflows/global-flags).

## Example commands

<CodeGroup>
  ```bash npm theme={null}
  npx extension@latest create my-extension --template=new-react
  ```

  ```bash pnpm theme={null}
  pnpx extension@latest create my-extension --template=new-react
  ```

  ```bash yarn theme={null}
  yarn dlx extension@latest create my-extension --template=new-react
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --template=new-react
  ```

  ```bash deno theme={null}
  deno run -A npm:extension@latest create my-extension --template=new-react
  ```
</CodeGroup>

<CodeGroup>
  ```bash npm theme={null}
  npx extension@latest create my-extension --install
  ```

  ```bash pnpm theme={null}
  pnpx extension@latest create my-extension --install
  ```

  ```bash yarn theme={null}
  yarn dlx extension@latest create my-extension --install
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --install
  ```

  ```bash deno theme={null}
  deno run -A npm:extension@latest create my-extension --install
  ```
</CodeGroup>

## Available templates

<Tip>
  For the full, continuously updated list of templates, browse the [examples
  repository](https://github.com/extension-js/examples/tree/main/examples).
</Tip>

<CardGroup cols={2}>
  <Card title="JavaScript (default)" icon="js" href="https://github.com/extension-js/examples/tree/main/examples/init">
    Minimal starter. Use when you want a clean baseline.
  </Card>

  <Card title="TypeScript" icon="typescript" href="https://github.com/extension-js/examples/tree/main/examples/new-typescript">
    Typed starter with `tsconfig.json` preconfigured.
  </Card>

  <Card title="React" icon="react" href="https://github.com/extension-js/examples/tree/main/examples/new-react">
    React UI wired for content scripts and popup views.
  </Card>

  <Card title="Vue" icon="vuejs" href="https://github.com/extension-js/examples/tree/main/examples/new-vue">
    Vue UI with single-file component (SFC) support baked in.
  </Card>
</CardGroup>

## Best practices

* Start from a template that matches your UI/runtime needs to reduce setup drift.
* Keep the first run small, then add extra tooling after verifying baseline command flow.