Using ESLint and Prettier for Vue and Nuxt apps

The eslint-plugin-vue plugin is an official ESLint plugin for Vue and Nuxt apps. It allows us to inspect the code in the <template> and <script> blocks in the .vue files with ESLint to find any syntax errors, the wrong use of Vue directives, and the Vue style violation against the Vue style guide. Also, we are using Prettier to enforce the code format, so install eslint-plugin-prettier and eslint-config-prettier just like we did in the previous section for the basic specific configurations that we prefer. Let's get all these sorted in the following steps:

1. Install this eslint-plugin-vue plugin using npm:

$ npm i eslint-plugin-vue --save-dev

You may get some warning:

npm WARN eslint-plugin-vue@5.2.3 requires a peer of eslint@^5.0.0
 but none is installed. You must install peer dependencies
  yourself.
npm WARN vue-eslint-parser@5.0.0 requires a peer of eslint@^5.0.0 
 but none is installed. You must install peer dependencies...