Introduction

In the previous chapter, we covered how to manage and manipulate data reactively in our component templates using Vue.js. In this chapter, we will be looking at how to support the development of such templates using Vue CLI. Vue.js takes advantage of the npm and webpack ecosystem, as seen in Chapter 1, Starting Your First Vue Project, in the The Vue Instance in a Simple Vue Application example. These tools help developers to quickly scaffold and build great web applications. Notable patterns inside of Vue.js are vue.config (which allows you to add webpack rules without directly editing the webpack file itself), two-way data binding, and single file components (SFCs), as seen in Chapter 1, Starting Your First Vue Project, in the Two-Way Binding Using V-Model example.

Webpack projects instantiated using the Vue command-line interface (Vue CLI) will come with hot reloading already installed. Hot reloading is a frontend development pattern where your app in the browser...