vue-cli

WIP: this is the work in progress branch of the upcoming vue-cli 3.0. Only for preview for template maintainers.

Development Setup

This project uses a monorepo setup that requires using Yarn because it relies on Yarn workspaces.

# install dependencies
yarn

# link `vue` executable
cd packages/@vue/cli
yarn link

# create test projects in /packages/test
export VUE_CLI_DEBUG=true
cd -
cd packages/test
vue create test-app
cd test-app
yarn dev

Core Concepts

There are two major parts of the system:

• @vue/cli: globally installed, exposes the vue create <app> command;
• @vue/cli-service: locally installed, exposes the vue-cli-service commands.

Both utilize a plugin-based architecture.

Creator

Creator is the class created when invoking vue create <app>. Responsible for prompting for preferences, invoking generators and installing dependencies.

Service

Service is the class created when invoking vue-cli-service <command> [...args]. Responsible for managing the internal webpack configuration, and exposes commands for serving and building the project.

Plugin

Plugins are locally installed into the project as devDependencies. @vue/cli-service ships with a number of built-in plugins. This repo also contains a number of plugins that are published as individual packages.

A plugin should export a function which receives two arguments:

• A PluginAPI instance
• Project local options specified in vue.config.js

The API allows plugins to extend/modify the internal webpack config for different environments and inject additional commands to vue-cli-service.

Generator

A plugin published as a package can also contain a generator.js file or a generator directory with index.js. The generator inside a plugin will be invoked after the plugin is installed.

A generator should export a function which receives a GeneratorAPI instance as the only argument. The API allows a generator to inject additional dependencies or fields into package.json and add files to the project.