Babel-eslint: Using decorator doesn't count as usage by eslint

[andreypopp]

Have the following code:

import autobind from 'autobind-decorator';

class TextareaAutosize {
  ...

  @autobind
  _onChange(e) { ... }
}

which results into:

   7:7   error    autobind is defined but never used                                                no-unused-vars

[zdychacek]

+1

[RobertCZ]

Related: Using in decorator's parameters doesn't count as usage either

import DataManager from 'DataManager'
@inject(DataManager)

[gaearon]

This is currently the biggest blocker for using decorators. Would love to see this fixed!

[Benoss]

+1

[b2whats]

+1

[istarkov]

+1

[istarkov]

There is also no-shadow hint for such situation with decorator

function blabla() {}

@blabla(() => 1)
export class Test {
}

gives
Test is already declared in the upper scope. (no-shadow)

[damassi]

+1. Just ran into this as well.

[olanod]

:+1:

[gaearon]

I guess you can contribute: https://github.com/alexkuz/eslint-plugin-decorator

[andreypopp]

I think it should be fixed by "fixing" estraverse to visit decorator AST
nodes so escope can find identifiers within.

On Sat, May 16, 2015, 16:35 Dan Abramov [email protected] wrote:

I guess you can contribute:
https://github.com/alexkuz/eslint-plugin-decorator

—
Reply to this email directly or view it on GitHub
https://github.com/babel/babel-eslint/issues/72#issuecomment-102613528.

[hzoo]

Can work on this - I guess I'l be using the examples from https://github.com/wycats/javascript-decorators for tests?

Looks like there's 3 checks - class, property, method

[hzoo]

Did a PR: #105 (I tested locally and it's good...although failing on travis) - can someone else test to see if it fixes the issue for them?

[hzoo]

Should be fixed in 3.1.6!

[andreypopp]

Thank you!

On Thu, May 21, 2015, 04:12 Henry Zhu [email protected] wrote:

Should be fixed in 3.1.6!

—
Reply to this email directly or view it on GitHub
https://github.com/babel/babel-eslint/issues/72#issuecomment-104068509.

[gaearon]

@hzoo You are awesome. Thank you _so_ much.

[gcanti]

Thanks @hzoo !

[raymond-h]

This feature apparently was broken sometime between releases v3.1.25 and v3.1.28, and still doesn't work as of v4.0.5.

[hzoo]

Nothing was changed related to decorators in the last few releases - most likely an issue with babel. I would either wait for the next release or pin your babel version (or actually maybe we should pin the babel version?).

Looking into it though.

[raymond-h]

You were right about it being an issue in babel, it seems; as noted in https://github.com/babel/babel/issues/2098 (and other issues that it is a duplicate of), some bug crept into babel, making decorators not working properly. After preventing the issue (by not using parens in decorators), babel-eslint once again recognizes uses within decorators as uses of variables.

[RobinQu]

Still not working + 1

  @service({foo:'bar'}})
  async myFunc() {
    //balabala
  }

[hzoo]

Can you make a new issue, and post with your config, and eslint, babel-eslint, babel version? Thanks

[RobinQu]

Sorry, that's a typo. It's working perfectly.

On Wed, Sep 16, 2015 at 7:29 PM, Henry Zhu [email protected] wrote:

Can you make a new issue, and post with your config, and eslint,
babel-eslint, babel version? Thanks

—
Reply to this email directly or view it on GitHub
https://github.com/babel/babel-eslint/issues/72#issuecomment-140713045.

[uhoh-itsmaciek]

Hi,

I'm running into the exact same symptoms on a version of eslint that should have this fix (4.4.1). I'm using mobx with mobx-react and trying to use the @observer decorators. E.g., if I run the linter on this class:

import React from 'react'

import {observer} from 'mobx-react'

export default @observer class Test extends React.Component {
  render () {
    return (
      <div>hello</div>
    )
  }
}

I get

  3:9  error  'observer' is defined but never used  no-unused-vars

✖ 1 problem (1 error, 0 warnings)

This is my .eslintrc:

{
  "parser": "babel-eslint",
  "plugins": ["react"],
  "extends": ["standard", "standard-jsx", "plugin:react/recommended"],
  "rules": {
    "comma-dangle": ["off", "always-multiline"],
  },
  "env": {
    "browser": true,
  },
}

And this is my .babelrc in case that's relevant:

{
  "presets": ["es2015", "stage-0", "react"],
  "plugins": ["transform-decorators-legacy"]
}

Any ideas? This actually seems to work fine, but the @observable stuff trips up eslint.

Here are the versions of all my eslint / babel plugins just in case that's useful.

    "babel-plugin-react-transform": "2.0.2",

    "babel-plugin-transform-decorators-legacy": "1.3.4",

    "babel-preset-react-hmre": "1.1.1",

    "babel-register": "^6.24.1",

    "eslint": "^4.4.1",

    "eslint-config-standard": "10.2.1",

    "eslint-config-standard-jsx": "4.0.2",

    "eslint-plugin-babel": "^4.1.2",

    "eslint-plugin-import": "^2.7.0",

    "eslint-plugin-node": "^5.1.1",

    "eslint-plugin-promise": "3.5.0",

    "eslint-plugin-standard": "3.0.1",

    "babel-cli": "^6.24.1",

    "babel-core": "^6.25.0",

    "babel-loader": "7.1.1",

    "babel-plugin-transform-decorators": "^6.24.1",

    "babel-polyfill": "^6.23.0",

    "babel-preset-es2015": "^6.24.1",

    "babel-preset-react": "^6.24.1",

    "babel-preset-stage-0": "^6.24.1",

  

[uhoh-itsmaciek]

So if anyone else runs into the above: I had babel-eslint configured as the parser, but did not actually have the module installed. I don't know why I was getting this error instead of something more sane, but clearly that's an eslint issue an not a babel-eslint one. Sorry for the noise. Hopefully my post can help others.

[frangeris]

Hey guys, why is this still happening?

"babel-eslint": "^8.2.1",
"eslint": "^4.16.0",

Error 1: action is defined but never used. (no-unused-vars)
Error 2: refreshing is not defined. (no-undef)

@uhoh-itsmaciek I've tested with eslint globally but still the same...

[djErock]

Ran into this issue using version

"babel-eslint": "8.2.2",

upgraded to

"babel-eslint": "8.2.3",

Ran a "scorched earth install" and it did the trick.