Unit testing components outside vue-cli folder: Module build failed (from ./node_modules/eslint-loader/index.js): Error: Failed to load plugin html: Cannot find module 'eslint-plugin-html'

[acacha]

Version

3.0.1

Reproduction link

https://github.com/acacha/vue-cli-problem-laravel

Node and OS info

node v8.10.0 npm 6.4.1 Ubuntru 18.0.4.1 LTS

Steps to reproduce

Clone the repo provided:

cd vue
npm install
npm run test:unit
 WEBPACK  Failed to compile with 1 error(s)

Error in ../resources/js/components/ExampleComponent.vue

  Module build failed (from ./node_modules/eslint-loader/index.js):
  Error: Failed to load plugin html: Cannot find module 'eslint-plugin-html'

 ERROR  mocha-webpack exited with code 1.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue@0.1.0 test:unit: `vue-cli-service test:unit`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the vue@0.1.0 test:unit script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/sergi/.npm/_logs/2018-10-10T09_23_31_834Z-debug.log

What is expected?

No errors

What is actually happening?

Error Module build failed (from ./node_modules/eslint-loader/index.js): Error: Failed to load plugin html: Cannot find module 'eslint-plugin-html'

---

I'm trying to test components outside vue-cli folder

See also issue:

https://github.com/vuejs/vue-cli/issues/2539

I followed suggestion to add file vue.config.js:

const path = require('path');
module.exports = {
    chainWebpack: config => {
        config.module
            .rule('eslint')
            .use('eslint-loader')
            .tap(options => {
                options.configFile = path.resolve(__dirname, ".eslintrc.js");
                return options;
            })
    },
    css: {
        loaderOptions: {
            postcss: {
                config:{
                    path:__dirname
                }
            }
        }
    }
}

Please note that the problem arise because test:

https://github.com/acacha/vue-cli-problem-laravel/blob/master/vue/tests/unit/ExampleComponent.spec.js

use a external component;

import ExampleComponent from '../../../resources/js/components/ExampleComponent'

[acacha]

What I'm trying to do is to test My Vue Laravel Components using a vue-cli project created inside Laravel

[acacha]

The problem is a litle bit ankward .... I've created another repo to demonstrate here:

https://github.com/acacha/vue-cli-problem-laravel1

But NO error in this repo! And I don't see any differences

[LinusBorg]

The problem is that you have another .eslintrc file in your project's root directory, which has conflicting configuration (and may not even be used anywhere?) - in particular, this confi tries to load eslint-plugin-html, which it can't find because it's not even a dependency of your project.

[LinusBorg]

I'll close this since it seems to be related to a misconfiguration of eslint on the user's side.