Nuxt.js: Module Error (from ./node_modules/eslint-loader/index.js):

Question

I installed Nuxt starter template the recommended way:

npx create-nuxt-app fffff

Once inside fffff I installed css-loder (npm install --save-dev css-loader) then I launched the server: npm run dev

I got this error message:

> [email protected] dev /home/begueradj/fffff
> nuxt



 INFO  Building project

✔ success Builder initialized
✔ success Nuxt files generated


 ERROR  Failed to compile with 1 errors                                                                                                                         22:09:09

 error  in ./layouts/default.vue

Module Error (from ./node_modules/eslint-loader/index.js):

/home/begueradj/fffff/layouts/default.vue
   89:1  error  Delete `··`                           prettier/prettier
   90:3  error  Delete `··`                           prettier/prettier
   91:1  error  Replace `······` with `····`          prettier/prettier
   92:1  error  Delete `··`                           prettier/prettier
   93:1  error  Replace `········` with `······`      prettier/prettier
   94:1  error  Delete `··`                           prettier/prettier
   95:1  error  Replace `········` with `······`      prettier/prettier
   96:1  error  Delete `··`                           prettier/prettier
   97:1  error  Replace `··········` with `········`  prettier/prettier
   98:7  error  Delete `··`                           prettier/prettier
   99:1  error  Delete `··`                           prettier/prettier
  100:7  error  Delete `··`                           prettier/prettier
  101:1  error  Delete `··`                           prettier/prettier
  102:7  error  Delete `··`                           prettier/prettier
  103:5  error  Delete `··`                           prettier/prettier
  104:1  error  Replace `····` with `··`              prettier/prettier
  105:1  error  Delete `··`                           prettier/prettier

✖ 17 problems (17 errors, 0 warnings)
  17 errors and 0 warnings potentially fixable with the `--fix` option.


 @ ./.nuxt/App.js 4:0-47 6:14-23
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi webpack-hot-middleware/client?name=client&reload=true&timeout=30000&path=/__webpack_hmr ./.nuxt/client.js



 READY  Listening on http://localhost:3000

What causes this? How to fix it?

Answer 1

The default source code generated by the create-nuxt-appdoesn't respect the ESlint + Prettier rules.

Try to fix each rules manually:

eg. 91:1 error Replace '······' with '····' => replace 6 spaces by 4 spaces at the beginning of the line #91 of the file layouts/default.vue.

or

Fix all rules automatically with the following command:

npx prettier --write "**/*.{vue,js}"

Answer 2

Not recommended but useful if you just want to play around

  // nuxt.config.js
  modules: [
    '@nuxtjs/axios'
    // '@nuxtjs/eslint-module' :: bypass this module
  ],

I hope that helps.