This page is currently work in progress
The CLI (
@vue/cli) is a globally installed npm package and provides the,
vuecommand in your terminal,
vue createto quickly scaffold a new project,
vue serveto instantly prototype new ideas, or
vue uito manage your projects using a graphical user interface.
The CLI Service (
@vue/cli-service) is a development dependency. It's an npm package installed locally into every project created by
The CLI Service is built on top of webpack and webpack-dev-server. It contains:
The core service that loads other CLI Plugins;
An internal webpack config that is optimized for most apps;
vue-cli-service binary inside the project, which comes with the basic
Using the CLI Service by,
accessing the binary directly as
vue-cli-service in npm scripts, or
./node_modules/.bin/vue-cli-service from the terminal.
vue-cli-service serve starts a dev server (based on
webpack-dev-server) that comes with Hot-Module-Replacement (HMR) working out of the box
vue-cli-service build produces a production-ready bundle in the dist/ directory, with minification for JS/CSS/HTML and auto vendor chunk splitting for better caching. The chunk manifest is inlined into the HTML. There are a few useful flags:
--modern builds your app using Modern Mode, shipping native ES2015 code to modern browsers that support it, with auto fallback to a legacy bundle.
--target allows you to build any component(s) inside your project as a library or as web components.
--report-json will generate reports based on your build stats that can help you analyze the size of the modules included in your bundle
vue-cli-service inspectinspects the webpack config inside the Vue project.
CLI Plugins are npm packages that provide optional features to your Vue CLI projects, such as Babel/TypeScript transpilation, ESLint integration, unit testing, and end-to-end testing. Plugins can modify the internal webpack configuration and inject commands to
Plugin naming conventions:
@vue/cli-plugin-for built-in plugins, or
vue-cli-plugin-for community plugins.
When you run the
vue-cli-service binary inside your project, it automatically resolves and loads all CLI Plugins listed in your project's
Plugins can be included as part of your project creation process or added into the project later. They can also be grouped into reusable presets.
vue add <plugin-name> to,
<plugin-name>to full package name,