Eslint-plugin-vue: Error while loading rule 'vue/no-confusing-v-for-v-if': Cannot read property 'on' of undefined

[ccalvarez]

Tell us about your environment

• ESLint Version: 4.4.1
• eslint-plugin-vue Version: 3.10.0
• Node Version: 6.11.2

Please show your full configuration:

.eslintrc.json

{
  "root": true,
  "extends": [
    "eslint:recommended",
    "plugin:vue/recommended",
    "plugin:import/errors",
    "plugin:import/warnings"
  ],
  "parserOptions": {
    "ecmaVersion": 7,
    "sourceType": "module"
  },
  "env": {
    "browser": true,
    "node": true,
    "mocha": true
  },
  "rules": {
    "no-console": 1
  }
}

What did you do? Please include the actual source code causing the issue.

package.json

"scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
    "lint": "eslint src/**"
  },

What did you expect to happen?

Steps to reproduce:

• Create project with vue-cli: vue init webpack-simple my-project
• Configure eslint as above
• In package.json file, add the script "lint" wich executes eslint src/**
• In the terminal window, run npm run lint

What actually happened? Please include the actual, raw output from ESLint.

Error while loading rule 'vue/no-confusing-v-for-v-if': Cannot read property 'on' of undefined TypeError: Error while loading rule 'vue/no-confusing-v-for-v-if': Cannot read property 'on' of undefined at ensureEmitter (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\vue-eslint-parser\index.js:2640:23) at Object.registerTemplateBodyVisitor (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\vue-eslint-parser\index.js:2653:29) at Object.registerTemplateBodyVisitor (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint-plugin-vue\lib\utils\index.js:38:28) at Object.create (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint-plugin-vue\lib\rules\no-confusing-v-for-v-if.js:40:9) at Object.keys.filter.forEach.ex (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint\lib\linter.js:874:67) at Array.forEach (native) at Linter.verify (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint\lib\linter.js:847:93) at processText (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint\lib\cli-engine.js:203:31) at processFile (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint\lib\cli-engine.js:245:18) at executeOnFile (C:\Bitbucket\resultados2018\construccion\frontend-resultados\node_modules\eslint\lib\cli-engine.js:585:25)

Thanks.

[armano2]

@ccalvarez it's fixed already on master https://github.com/vuejs/eslint-plugin-vue/commit/8761bdeb74dab5551639634a75af84ce29cfb520

Its failing due to breaking changes in eslint 4.4.0, you can use Eslint <= 4.3.0 till next release of plugin

[ccalvarez]

@armano2 I got it, thank you very much!

[willin]

eslint 4.3

Cannot read property 'recommended' of undefined

module.exports = {
  root: true,
  extends: [
    'dwing',
    'plugin:vue/recommended'
  ]
};

@ccalvarez

[wd]

@willin you need to install the beta version of eslint-plugin-vue, yarn add --dev eslint-plugin-vue@beta

[pimskie]

@willin
I fixed it by changing this:

module.exports = {
  extends: [
    'plugin:vue/recommended',
  ]
}

to:

module.exports = {
  extends: [
    //
  ],
  plugins: ['vue'],
}

As described here: https://www.npmjs.com/package/eslint-plugin-vue
Used with "eslint-plugin-vue": "2.1.0"