Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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' #2707

Closed
acacha opened this issue Oct 10, 2018 · 4 comments

Comments

@acacha
Copy link

acacha commented Oct 10, 2018

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:

#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
Copy link
Author

acacha commented Oct 10, 2018

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

@acacha
Copy link
Author

acacha commented Oct 10, 2018

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

@acacha acacha changed the title Module build failed (from ./node_modules/eslint-loader/index.js): Error: Failed to load plugin html: Cannot find module 'eslint-plugin-html' 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' Oct 10, 2018
@LinusBorg
Copy link
Member

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
Copy link
Member

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants