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

Throws Parsing Error inside template tag #186

Closed
asolopovas opened this Issue Sep 13, 2017 · 4 comments

Comments

Projects
None yet
4 participants
@asolopovas
Copy link

asolopovas commented Sep 13, 2017

Hi I am using Phpstorm and it throws Parsing Error inside template tag in vue files. I am not sure whats causing it. Maybe someone can help.

It does throw parsing error on <form class="bg col" @submit.prevent> if I remove @submit.prevent it throws it at :label="key"

Thanks in advance.

Tell us about your environment

  • ESLint Version: 4.6.1
  • eslint-plugin-vue Version: 3.10.0
  • Node Version: 8.5.0

Please show your full configuration:

{
    "root": true,
    "parser": "babel-eslint",
    "plugins": ["flowtype", "html"],
    "settings": {
        "html/html-extensions": [".html"]
    },
    "globals": {
        "axios": true,
        "elastic": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:vue/recommended"
    ],
    "rules": {
        "curly": ["error", "all"],
        "comma-dangle": ["error", "only-multiline"],
        "camelcase": ["error", {"properties": "never"}],
        "flowtype/define-flow-type": 1,
        "flowtype/use-flow-type": 1,
        "indent": ["error", 4, {"SwitchCase": 1}],
        "object-curly-spacing": ["error", "never"],
        "space-before-function-paren": ["error", "never"],
        "space-before-blocks": ["error", "always"],
        "space-infix-ops": ["error", {"int32Hint": false}],
        "no-alert": "error",
        "no-dupe-args": "error",
        "no-duplicate-case": "error",
        "no-duplicate-imports": "error",
        "no-empty": "error"
    },
    "env": {
        "browser": true,
        "node": true,
        "commonjs": true,
        "es6": true
    }
}

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

<template>
    <div class="frame md-6 col ">
        <form class="bg col" @submit.prevent>
            <edit-row v-for="(value,key,index) in structure"
                      :label="key"
                      :key="index"
                      :params="value"
                      v-model="itemNew[key]"
            ></edit-row>
            <action-button :btns="{create: '&#9998;', reset: '&#x274C;'}"
                           @reset="resetForm()"
                           @create="create()"
            ></action-button>
        </form>
    </div>
</template>
<script>
    import newItem from '../mixins/newItem'

    export default {
        mixins: [newItem],
    }
</script>

What did you expect to happen?

No parse erorrs displayed

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

Parse errors displayed in folowing form:
ESLint: Parsing error: Unexpected token 1| <template> 2| <div class="frame md-6 col "> 3| <form class="bg col" @submit.prevent> | ^ 4| <edit-row v-for="(value,key,index) in structure" 5| :label="key" 6| :key="index"

@mysticatea

This comment has been minimized.

Copy link
Member

mysticatea commented Sep 14, 2017

Thank you for this issue.

The cause is "parser": "babel-eslint", setting. Please move it into "parserOptions".

  {
      "root": true,
-     "parser": "babel-eslint",
+     "parserOptions": {
+         "parser": "babel-eslint"
+     },
      "plugins": ["flowtype", "html", "vue"],
      "settings": {
          "html/html-extensions": [".html"]
      },
      "globals": {
          "axios": true,
          "elastic": true
      },
      "extends": [
          "eslint:recommended",
          "plugin:vue/recommended"
      ],
      "rules": {
          "curly": ["error", "all"],
          "comma-dangle": ["error", "only-multiline"],
          "camelcase": ["error", {"properties": "never"}],
          "flowtype/define-flow-type": 1,
          "flowtype/use-flow-type": 1,
          "indent": ["error", 4, {"SwitchCase": 1}],
          "object-curly-spacing": ["error", "never"],
          "space-before-function-paren": ["error", "never"],
          "space-before-blocks": ["error", "always"],
          "space-infix-ops": ["error", {"int32Hint": false}],
          "no-alert": "error",
          "no-dupe-args": "error",
          "no-duplicate-case": "error",
          "no-duplicate-imports": "error",
          "no-empty": "error"
      },
      "env": {
          "browser": true,
          "node": true,
          "commonjs": true,
          "es6": true
      }
  }

See also: https://github.com/vuejs/eslint-plugin-vue#what-is-the-use-the-latest-vue-eslint-parser-error

@asolopovas

This comment has been minimized.

Copy link

asolopovas commented Sep 14, 2017

Now I am getting Error while loading rule 'vue/no-confusing-v-for-v-if': Cannot read property 'on' of undefined

@LeonWuV

This comment has been minimized.

Copy link

LeonWuV commented Dec 17, 2018

Thanks, solved my problem.

@zuobaiquan

This comment has been minimized.

Copy link

zuobaiquan commented Dec 24, 2018

Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment