Command line interface for rapid Vue.js development
npx @tessl/cli install tessl/npm-vue--cli@5.0.0Vue CLI is a comprehensive command-line tool for Vue.js development that provides project scaffolding, plugin management, build tools, and a complete development workflow. It offers an interactive project creation experience with customizable presets, extensive configuration options, and a rich plugin ecosystem.
npm install -g @vue/cliFor programmatic usage (plugin development):
import { Creator, Generator, GeneratorAPI, PromptModuleAPI } from "@vue/cli";For CommonJS:
const { Creator, Generator, GeneratorAPI, PromptModuleAPI } = require("@vue/cli");# Create a new Vue project
vue create my-project
# Add a plugin to existing project
vue add @vue/router
# Start development server
vue serve
# Build for production
vue build
# Open Vue CLI UI
vue uiVue CLI is built around several key components:
vue <command> for project lifecycle managementInteractive project scaffolding with customizable presets, feature selection, and package manager choice.
vue create <app-name> [options]
Options:
-p, --preset <presetName> Skip prompts and use saved or remote preset
-d, --default Skip prompts and use default preset
-i, --inlinePreset <json> Skip prompts and use inline JSON string as preset
-m, --packageManager <command> Use specified npm client when installing dependencies
-r, --registry <url> Use specified npm registry when installing dependencies (only for npm)
-g, --git [message] Force git initialization with initial commit message
-n, --no-git Skip git initialization
-f, --force Overwrite target directory if it exists
--merge Merge target directory if it exists
-c, --clone Use git clone when fetching remote preset
-x, --proxy <proxyUrl> Use specified proxy when creating project
-b, --bare Scaffold project without beginner instructions
--skipGetStarted Skip displaying "Get started" instructions
vue init <template> <app-name> # (legacy) generate a project from a remote template (requires @vue/cli-init)Install, invoke, and manage Vue CLI plugins in existing projects.
vue add <plugin> [pluginOptions]
vue invoke <plugin> [pluginOptions]
Options:
--registry <url> Use specified npm registry when installing dependencies (only for npm)Development server, build tools, and configuration inspection.
vue serve # alias of "npm run serve" in the current project
vue build # alias of "npm run build" in the current project
vue inspect [paths...] # inspect the webpack config in a project
Inspect Options:
--mode <mode> Specify mode
--rule <ruleName> Inspect a specific module rule
--plugin <pluginName> Inspect a specific plugin
--rules List all module rule names
--plugins List all plugin names
-v --verbose Show full function definitions in outputCLI configuration, preset management, and project settings.
vue config [value] # inspect and modify the config
Config Options:
-g, --get <path> Get value from option
-s, --set <path> <value> Set option value
-d, --delete <path> Delete option from config
-e, --edit Open config with default editor
--json Outputs JSON result onlyUpdate checking, upgrade utilities, and migration tools.
vue outdated # (experimental) check for outdated vue cli service / plugins
vue upgrade [plugin-name] # (experimental) upgrade vue cli service / plugins
vue migrate [plugin-name] # (experimental) run migrator for an already-installed cli plugin
Maintenance Options:
--next Also check for alpha / beta / rc versions when upgrading
-t, --to <version> Upgrade <package-name> to a version that is not latest
-f, --from <version> Skip probing installed plugin, assuming it is upgraded from the designated version
-r, --registry <url> Use specified npm registry when installing dependencies
--all Upgrade all pluginsWeb-based project management interface.
vue ui # start and open the vue-cli ui
UI Options:
-H, --host <host> Host used for the UI server (default: localhost)
-p, --port <port> Port used for the UI server (by default search for available port)
-D, --dev Run in dev mode
--quiet Don't output starting messages
--headless Don't open browser on start and output portAPIs for plugin development and programmatic project creation.
class Creator extends EventEmitter {
constructor(name: string, context: string, promptModules: PromptModule[]);
create(cliOptions?: CreateOptions, preset?: Preset): Promise<void>;
promptAndResolvePreset(answers?: Answers): Promise<Preset>;
resolvePreset(name: string, clone?: boolean): Promise<Preset>;
}
class GeneratorAPI {
constructor(id: string, generator: Generator, options: any, rootOptions: Preset);
resolve(...paths: string[]): string;
hasPlugin(id: string, versionRange?: string): boolean;
extendPackage(fields: object | ((pkg: object) => object), options?: ExtendPackageOptions): void;
render(source: string | object | FileMiddleware, additionalData?: object, ejsOptions?: object): void;
postProcessFiles(cb: PostProcessFilesCallback): void;
onCreateComplete(cb: (...args: any[]) => any): void;
readonly cliVersion: string;
readonly cliServiceVersion: string;
readonly entryFile: 'src/main.ts' | 'src/main.js';
readonly invoking: boolean;
}
class PromptModuleAPI {
constructor(creator: Creator);
injectFeature(feature: CheckboxChoiceOptions): void;
injectPrompt(prompt: DistinctQuestion): void;
injectOptionForPrompt(name: string, option: ChoiceOptions): void;
onPromptComplete(cb: OnPromptCompleteCb): void;
}interface Preset {
bare?: boolean;
projectName?: string;
useConfigFiles?: boolean;
plugins?: Record<string, any>;
configs?: Record<string, any>;
cssPreprocessor?: 'sass' | 'dart-sass' | 'less' | 'stylus';
[props: string]: any;
}
interface ExtendPackageOptions {
prune?: boolean;
merge?: boolean;
warnIncompatibleVersions?: boolean;
forceOverwrite?: boolean;
}
interface CreateOptions {
cwd?: string;
proxy?: string;
packageManager?: string;
registry?: string;
git?: boolean | string;
force?: boolean;
merge?: boolean;
clone?: boolean;
bare?: boolean;
skipGetStarted?: boolean;
}
type GeneratorPlugin = (
api: GeneratorAPI,
options: any,
rootOptions: Preset,
invoking: boolean
) => any;
type FileMiddleware = (files: RenderFile, render: typeof ejs.render) => void;
type PostProcessFilesCallback = (files: RenderFile) => void;
type OnPromptCompleteCb<T = any> = (
answers: T,
options: { useConfigFiles: boolean; plugins: Record<string, any> }
) => void;
interface RenderFile {
[path: string]: string | Buffer;
}