token.type.endsWith is not a function with vue/script-indent

[KaelWD]

Tell us about your environment

• ESLint Version: 4.15.0
• eslint-plugin-vue Version: 4.2.0
• Node Version: 8.9.1

Please show your full configuration:

module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint',
    ecmaVersion: 2017,
    sourceType: 'module'
  },
  env: {
    node: true,
    browser: true
  },
  extends: [
    'plugin:vue/recommended',
    'standard'
  ],
  rules: {
    "vue/script-indent": ["error", 2, {
      "baseIndent": 1,
      "switchCase": 0,
      "ignores": []
    }]
...

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

return (
  // it's inside node_modules
  /node_modules/.test(module.context) &&
  // and not a CSS file (due to extract-text-webpack-plugin limitation)
  !/\.css$/.test(module.request)
)

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

TypeError: token.type.endsWith is not a function
    at isComment (eslint-plugin-vue/lib/utils/indent-common.js:186:120)
    at Array.every (<anonymous>)
    at :matches(Program, VElement[parent.type!='VElement']):exit (eslint-plugin-vue/lib/utils/indent-common.js:1493:37)
    at listeners.(anonymous function).forEach.listener (eslint/lib/util/safe-emitter.js:47:58)
    at Array.forEach (<anonymous>)
    at Object.emit (eslint/lib/util/safe-emitter.js:47:38)
    at NodeEventGenerator.applySelector (eslint/lib/util/node-event-generator.js:251:26)
    at NodeEventGenerator.applySelectors (eslint/lib/util/node-event-generator.js:280:22)
    at NodeEventGenerator.leaveNode (eslint/lib/util/node-event-generator.js:303:14)
    at CodePathAnalyzer.leaveNode (eslint/lib/code-path-analysis/code-path-analyzer.js:630:23)

The token passed into isComment: (it's the ! before the regexp)

{
  "type": {
    "label": "!",
    "beforeExpr": true,
    "startsExpr": true,
    "rightAssociative": false,
    "isLoop": false,
    "isAssign": false,
    "prefix": true,
    "postfix": false,
    "binop": null,
    "updateContext": null
  },
  "value": "!",
  "start": 963,
  "end": 964,
  "loc": {
    "start": {
      "line": 26,
      "column": 10
    },
    "end": {
      "line": 26,
      "column": 11
    }
  },
  "range": [
    963,
    964
  ]
}

[mysticatea]

Thank you for this issue.

This looks like a bug of babel-eslint. As ESLint AST spec, the type must be a string. Would you report it to https://github.com/babel/babel-eslint ?

[KaelWD]

Same thing's happening here:

search (val) {
  if (!val) {
    this.docSearch.autocomplete.autocomplete.close()
  }
}

[samit4me]

Having the same issue, is there any workarounds until the upstream issue is solved?

[KaelWD]

The fix was finally released in babel-eslint 8.2.1, so it just needs to be updated in this project.

[samit4me]

Updating the following resolved the issue for me:

"eslint-plugin-vue": "^4.3.0",
"babel-eslint": "^8.2.1"

[rafaelkendrik]

Just a note, after updating babel-eslint and eslint-plugin-vue, i'm still having the same issue in this case:

"babel-eslint": "^8.2.1",
"eslint-plugin-vue": "^4.4.0",

Tell us about your environment:

• ESLint Version: 4.15.0
• eslint-plugin-vue Version: 4.4.0
• Node Version: 9.8.0

Please show your full configuration:

{
  "parserOptions": {
    "parser": "babel-eslint"
  },  
  "env": {
    "browser": true,
    "es6": true
  },  
  "extends": [
    "plugin:vue/essential",
    "airbnb-base"
  ],  
  "plugins": [
    "vue"
  ],  
  "rules": {
    "max-len": ["error", 80],
    "semi": ["error", "never"],
    "indent": ["off", "always"],
    "comma-dangle": ["error", "never"],
    "arrow-parens": ["error", "as-needed"],
    "consistent-return": ["off", "always"],
    "no-useless-escape": ["off", "always"],
    "quote-props": ["error", "consistent-as-needed"],
    "vue/script-indent": ["error", 2, { "baseIndent": 1 }], 
    "import/no-unresolved": ["off", "always"],
    "import/extensions": ["off", "always", {
      "js": "never",
      "vue": "never",
      "json": "never"
    }]  
  }
}

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

I ran the lint to a file that contains:

const typeGroup = obj =>
  !emptyObject(obj) && !typeLeaf(obj)

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

yarn run v1.5.1
$ eslint --ext .js,.vue ./src
token.type.endsWith is not a function
TypeError: token.type.endsWith is not a function
    at isComment (/rafael/sample/node_modules/eslint-plugin-vue/lib/utils/indent-common.js:186:118)
    at Array.every (<anonymous>)
    at :matches(Program, VElement[parent.type!='VElement']):exit (/rafael/sample/frontend/node_modules/eslint-plugin-vue/lib/utils/indent-common.js:1523:37)
    at listeners.(anonymous function).forEach.listener (/rafael/sample/frontend/node_modules/eslint/lib/util/safe-emitter.js:47:58)
    at Array.forEach (<anonymous>)
    at Object.emit (/rafael/sample/frontend/node_modules/eslint/lib/util/safe-emitter.js:47:38)
    at NodeEventGenerator.applySelector (/rafael/sices/frontend/node_modules/eslint/lib/util/node-event-generator.js:251:26)
    at NodeEventGenerator.applySelectors (/rafael/sample/frontend/node_modules/eslint/lib/util/node-event-generator.js:280:22)
    at NodeEventGenerator.leaveNode (/rafael/sices/frontend/node_modules/eslint/lib/util/node-event-generator.js:303:14)
    at CodePathAnalyzer.leaveNode (/rafael/sample/frontend/node_modules/eslint/lib/code-path-analysis/code-path-analyzer.js:630:23)
error An unexpected error occurred: "Command failed.
Exit code: 1

It works fine including the braces and return:

const typeGroup = obj => {
  return !emptyObject(obj) && !typeLeaf(obj)
}

With inline statement:

const typeGroup = obj => !emptyObject(obj) && !typeLeaf(obj)

or with parent:

const typeGroup = obj => 
  (!emptyObject(obj) && !typeLeaf(obj))

But got this issue doing this:

const typeGroup = obj =>
  !emptyObject(obj) && !typeLeaf(obj)

[gabaum10]

I'm running into this as well, with a similar setup as above. However, my error is happening internally in a library I have installed, Vuetify. I can't upgrade the chain of deps for babel because of this error.

[gabaum10]

I debugged the "isComment" function that's erroring and am seeing token is not a string in this case:

TokenType {
  label: '!',
  keyword: undefined,
  beforeExpr: true,
  startsExpr: true,
  rightAssociative: false,
  isLoop: false,
  isAssign: false,
  prefix: true,
  postfix: false,
  binop: null,
  updateContext: null }  

That's what the token looks like and is clearly different than the rest. I'm not entirely sure why.

[gabaum10]

Actually, it has nothing to do with the library. It really is as described by @rafaelkendrik . Break a conditional statement to a new line and it'll break your builds. I was able to work around it by removing those breaks, but it's definitely an issue somewhere in the stream.

[mysticatea]

This was resolved. Please upgrade babel-eslint.

Thank you.

[gabaum10]

@mysticatea quick question. Is it fixed the the 9.0.0 beta? Or 8.2.6?

[mysticatea]

@gabaum10 It was 8.2.2.

[Titans1001]

to solve：

remove babel-eslint

add "eslint": "7.30.0", "eslint-plugin-vue": "6.2.2", "@babel/eslint-parser": "7.15.8",

.eslintrc.js edit： parserOptions: { parser: '@babel/eslint-parser' },

success

[Mihailoff]

Thanks @Titans1001, I ended up with

"@babel/eslint-parser": "^7.15.8",
"@vue/cli-plugin-eslint": "^5.0.0-beta.6",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^7.20.0",

[nagwan]

i faced the same issue and fixed by updating "eslint-plugin-vue": "^8.3.0"

[yogithesymbian]

TypeError: token.type.endsWith is not a function Occurred while linting not work

[yogithesymbian]

in my case solved by change to disabled instead of readonly

                  <vue-autosuggest
                    id="vi-boat-name"
                    v-model="form.dm_river_boat.boat_name"
                    v-uppercase
                    :suggestions="[{ data: form.dm_river_boat.dm_river_boats }]"
                    :get-suggestion-value="getSuggestionValue"

                    :input-props="{
                      id: 'autosuggest__input',
                      class: 'form-control',
                      placeholder: 'Boat Name',
                     readonly: $can('manage', 'special') ? true : $router.currentRoute.params.id !== undefined ? false : null
solved by change to disabled instead of readonly
                     disabled: $can('manage', 'special') ? true : $router.currentRoute.params.id !== undefined ? false : null
                    }"
                    @focus="getSuggestionValueFocus($event, 'dm_river_boat', 'boat_name')"
                    @input="searchForm($event, 'dm_river_boat/', 'dm_river_boat', 'boat_name')"
                  >

i use "vue-autosuggest": "2.2.0", no need to update everything is fine with me.

[Titans1001]

这个需要升级eslint 配置，原来的作者不推荐使用了

------------------ 原始邮件 ------------------ 发件人: @.>; 发送时间: 2022年9月25日(星期天) 中午11:31 收件人: @.>; 抄送: @.>; @.>; 主题: Re: [vuejs/eslint-plugin-vue] token.type.endsWith is not a function with vue/script-indent (#349)

in my case solved by change to disabled instead of readonly <vue-autosuggest id="vi-boat-name" v-model="form.dm_river_boat.boat_name" v-uppercase :suggestions="[{ data: form.dm_river_boat.dm_river_boats }]" :get-suggestion-value="getSuggestionValue" :input-props="{ id: 'autosuggest__input', class: 'form-control', placeholder: 'Boat Name', readonly: $can('manage', 'special') ? true : $router.currentRoute.params.id !== undefined ? false : null solved by change to disabled instead of readonly disabled: $can('manage', 'special') ? true : $router.currentRoute.params.id !== undefined ? false : null }" @focus="getSuggestionValueFocus($event, 'dm_river_boat', 'boat_name')" @input="searchForm($event, 'dm_river_boat/', 'dm_river_boat', 'boat_name')" >
i use "vue-autosuggest": "2.2.0", no need to update everything is fine with me.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: @.***>