Example of Vue.js

Let's work with the Vue CLI to create a sample project:

1. Install the CLI with npm install -g @vue/cli.
2. Execute vue create vue-example in a new directory. For our purposes, you can use the default options by pressing Enter at each prompt.
3. Enter the directory: cd vue-example.

4. Start the program with yarn serve:

Figure 8.7 – Vue generator home page

Vue's CLI generator created a number of files for us in the vue-example directory:

.
├── README.md
├── babel.config.js
├── package.json
├── public
│ ├── favicon.ico
│ └── index.html
├── src
│ ├── App.vue
│ ├── assets
│ │ └── logo.png
│ ├── components
│ │ └── HelloWorld.vue
│ └── main...