Skip to content

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

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

Closed
KaelWD opened this issue Jan 15, 2018 · 18 comments
Closed

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

KaelWD opened this issue Jan 15, 2018 · 18 comments
Assignees

Comments

@KaelWD
Copy link
Contributor

KaelWD commented Jan 15, 2018

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

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

KaelWD commented Jan 15, 2018

Same thing's happening here:

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

@samit4me
Copy link

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

@KaelWD
Copy link
Contributor Author

KaelWD commented Feb 24, 2018

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

@samit4me
Copy link

Updating the following resolved the issue for me:

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

@rafaelkendrik
Copy link

rafaelkendrik commented Apr 12, 2018

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

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

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

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

This was resolved. Please upgrade babel-eslint.

Thank you.

@gabaum10
Copy link

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

@mysticatea
Copy link
Member

@gabaum10 It was 8.2.2.

@Titans1001
Copy link

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

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

nagwan commented Jan 17, 2022

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

@yogithesymbian
Copy link

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

@yogithesymbian
Copy link

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

Titans1001 commented Sep 26, 2022 via email

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

Successfully merging a pull request may close this issue.

9 participants