Called a “completely different beast” from its predecessor by Vue.js creator Evan You, Vue CLI 3.0, or Vue 3, is intended to reduce configuration “fatigue” of front-end tools. Incorporating best practices in the tool chain was a goal as well.
Vue 3 provides Vue CLI projects out-of-the-box support for the following:
- Preconfigured webpack capabilities, including hot module replacement, code-splitting, and efficient long-term caching.
- Support for the PostCSS tool and major CSS preprocessors.
- Auto-generated HTML with hashed asset links and preload/prefetch resource hints.
Vue 3.0 integrates with technologies such as TypeScript, the ESLint linting utility, and Mocha unit testing.
For prototyping, developers can use the
vue serve command for prototyping with single-file components. To build a web component, use the command
vue-cli-service build --target wc --name my-elementsrc
The Modern Mode in Vue CLI will produce app versions for modern browsers that support ECMAScript modules and another targeting old browsers that do not support these modules. Use this command
vue-cli-service build --modern for Modern Mode.
Vue CLI 3 was designed with a plugin architecture. Plugins can inject dependencies and files during an application’s scaffolding, tweak a webpack configuration, or inject additional commands to the CLI service. Most built-in integrations are implemented as plugins via a plugin API; TypeScript is one such integration.
Also in Vue CLI 3, developers can set a remote preset to share a selection of plugins. Vue CLI 3 also has a UI for creating new projects and managing plugins and tasks. The UI has a webpack dashboard.