When it comes to quickly develop an application with Vue.js, developers who are experts in this framework often turn to Vue Cli, a complete system for rapid development.
On the official website, they describe Vue Cli to us in this way “Vue CLI is intended to be the baseline of standard tools for the Vue ecosystem. It ensures that the various build tools work seamlessly along with sensible defaults so you can focus on writing your app instead of spending days arguing with configurations. At the same time, it still offers the flexibility to modify the configuration of each tool without the need to eject it.”
Vue Cli has several parts and we present each one and what they work for:
The Cli consists of an npm package and it provides the vue command in your terminal. This package stands out for giving the ability to quickly mount a project through vue create. You can manage the projects using a graphical interface through vue ui.
The Cli service (@vue/cli-service) is a development dependency. It is an npm package installed locally on every project created by @vue/cli.
On their website, they explain that the CLI service is based on webpack and webpack-dev-server. In addition, it contains:
Cli plugins are nothing more than npm packages that can bring special features to your Vue Cli projects, like Babel/TypeScript transpilation, as well as ESLint integration, unit tests, and more.
Detecting a Vue Cli plugin is pretty straightforward because their names start with @vue/cli-plugin- (this one for built-in plugins) or vue-cli-plugin-, the latter 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 .json package.
Plugins can be included as part of your project creation process or added to the project later. They can also be grouped into reusable presets.