skip to content

How do you run create-vue non-interactively from a script or CI job, and which prompts can still appear even when you pass feature flags?

level: seniorimportance: should knowfreq 15%

answer

  1. a double dash before flags
  2. any feature flag skips feature prompts
  3. the directory is a positional
  4. force for a non-empty folder
  5. strict parsing rejects typos

basics

~20 s

Pass a directory and feature flags after --, as in npm create vue@latest admin-tool -- --ts --router --pinia --vitest. Any feature flag skips the feature prompts, but a missing directory, a non-empty folder without --force or an invalid package name still prompts.

solid answer

~40 s

With npm, flags go after `--`: `npm create vue@latest admin-tool -- --ts --router --pinia --vitest --eslint`. If any **feature flag** is present, create-vue skips the TypeScript, feature, E2E, experimental and barebone prompts and uses only the flags. Three prompts are not feature prompts and can still block a script: the project name when no directory is given, the overwrite question for a non-empty folder unless `--force` is passed, and the package name when the folder name is not a valid npm name. `--bare` is an option, not a feature flag, so `--bare` alone still shows the feature prompts. Arguments are parsed strictly, so a misspelled flag stops the run with an error. `--default` means no extra features but TypeScript on.

code

bash · 5 lines
bash
npm create vue@latest admin-tool -- --ts --router --pinia --vitest --eslint --prettier
cd admin-tool
npm install
npm run test:unit -- --run
npm run build

go deeper

for a junior

Recall that flags go after -- with npm and that feature flags such as --ts and --router replace the prompts.

for a middle

Explain the difference between feature flags and options, and list the three prompts that flags do not suppress.

for a senior

Write a CI-safe scaffold command: directory given, --force where needed, every feature explicit, and knowledge of --default, --bare and deprecated flags.

for a principal

Decide whether teams scaffold from a documented create-vue command or a maintained template repo, and how that choice stays current.

## Flags versus prompts create-vue has two kinds of switches: - **Feature flags** pick what goes into the project: `--default`, `--ts`/`--typescript`, `--jsx`, `--router`/`--vue-router`, `--pinia`, `--vitest`, `--cypress`, `--playwright`, `--eslint`, `--prettier`, and the experimental `--oxfmt`, `--vue-rc` and `--tsgo`. - **Options** change how it runs: `--force`, `--bare`, `--help` and `--version`. The rule in the source is simple: if **any** feature flag is present, every feature-related prompt is skipped, including TypeScript, the feature multiselect, the E2E framework, experimental features and the barebone question. Whatever you did not flag is off. ## Prompts that flags do not skip | Prompt | Appears when | How to avoid it | |---|---|---| | Project name | no directory argument | pass the directory as a positional | | Overwrite? | the target folder is not empty (a lone `.git` is fine) | pass `--force` or use an empty folder | | Package name | the folder name is not a valid npm package name | use a lowercase, dash-separated name | The help text says the same: the tool runs interactively without feature flags, or when the directory is missing or not a valid package name. ## A reproducible command ```bash npm create vue@latest admin-tool -- --ts --router --pinia --vitest --eslint --prettier ``` 1. `@latest` pins the scaffolder to the current release instead of a cached one. 2. `--` tells npm that the rest belongs to create-vue; PowerShell users have to quote it as `'--'`. 3. `admin-tool` is both the folder and the package name. 4. The flags list every feature; anything not listed is off, including TypeScript unless `--ts`, `--default` or `--tsgo` is present. ## Flags with surprises - **`--default`** creates a project with no optional features, but TypeScript is on: in the source it is one of the flags that enable TypeScript. - **`--bare`** is an option. On its own it does not suppress prompts; combined with feature flags it produces the barebone project without asking. - **`--tests` / `--with-tests`** is marked unstable and currently equals `--vitest --cypress`. - **`--cypress` without `--vitest`** also adds Cypress Component Testing. - **`--oxlint`** is deprecated: Oxlint is always included with `--eslint`. **`--eslint-with-prettier`** is deprecated in favour of `--eslint --prettier`. - **`--vue-beta`** is kept as an alias of `--vue-rc`, which opts into the Vue 3.6 release candidate. - **Typos fail loudly.** Arguments are parsed with strict mode, so `--typscript` ends the run with an error instead of being ignored, which is what you want in CI. ## Experimental flags in scripts `--vue-rc` and `--tsgo` rewrite dependency versions through package-manager overrides. Interactively, choosing either adds a package-manager question; in flag mode there is no prompt, and the scaffolder uses the manager it infers from how it was launched. Run the script with the package manager the project will actually use, or the overrides land in the wrong format. `--tsgo` also switches TypeScript on by itself. ## Checking what you got - `npm create vue@latest -- --help` prints every feature flag and option for the release you run, which is the authority when a blog post lists an older flag. - `--version` prints the create-vue version, useful to record in the CI log next to the scaffold step. - The generated `README.md` lists the commands for the features you picked, such as type-check, unit tests and lint, so a reviewer can see the selection without reading `package.json`. ## Mistakes worth catching - Forgetting `--` with npm, so npm itself swallows the flags and the scaffolder starts interactively. - Scaffolding into a checked-out repository folder in CI without `--force`, and the job hangs on the overwrite prompt. - Relying on `--bare` to make a run non-interactive. - Assuming unflagged features follow the interactive defaults; with flags, TypeScript is only on when a TypeScript-enabling flag is present.

  • Why is strict argument parsing useful when scaffolding in CI?
    A misspelled flag such as `--typscript` makes create-vue exit with an error instead of silently producing a JavaScript project. The job fails at the scaffold step, where the cause is obvious, rather than later when a type-check or import unexpectedly breaks.
  • How do you get the barebone project without any prompt?
    Combine `--bare` with at least one feature flag and a directory, for example `npm create vue@latest admin-tool -- --ts --router --bare`. The feature flag suppresses the prompts, and `--bare` sets the barebone choice that would otherwise be asked.

saying these in an interview costs you the question

  • Passing any feature flag makes create-vue fully non-interactive.
  • --bare on its own skips all the prompts.
  • --default scaffolds a plain JavaScript project.
  • Unknown flags are ignored, so a typo just turns that feature off.
  • --oxlint is still needed to get Oxlint alongside ESLint.