ESLint's "no-undef" rule is calling my use of Underscore an undefined variable

Question

I am using Grunt as my Build Tool and ESLint as my linting tool for an app I am working on. I am also using the Underscore Node package, and have made use of it in my app. Unfortunately, when I run ESLint on my code, it thinks that _ is an undefined variable in the following line:

return _.pluck(objects, nameColumn);

This is the error it is giving me:

78:21 error "_" is not defined no-undef

I would prefer not to disable the no-undef rule for ESLint, and I have tried installing the Underscore plugin, but I am still receiving this error. If anyone else has any ideas for what to try with this, I would be very appreciative!

If there is any further information I can give that would help anyone with helping me get this figured out, just let me know!

Solution 1

The official documentation should give you an idea on how to fix this.

Any reference to an undeclared variable causes a warning, unless the variable is explicitly mentioned in a /*global ...*/ comment, or specified in the globals key in the configuration file.

The easiest fix would be to add

/* global _ */

at the top of your file.

Or better, explicitly specify that the variable is read-only, to disallow overwriting the variable:

/* global _:readonly */

But since you'll have to do that for each new js file, it can get annoying. If you are using underscore often, I'd suggest to add globals to your .eslintrc file, for example:

{
    "globals": {
        "_": "readonly"
    }
}

And save this as .eslintrc in your project root, or optionally in your user home directory. Although some say the latter not recommended, it can sometimes be convenient, but you have to remember that you have it there :)

---

Explanation of the above rule: "_": "readonly" (used to be "_": false, now deprecated) means that a variable named _ tells eslint that this variable is defined globally and it will not emit any no-undef errors for this variable. As @sebastian pointed out, "readonly" (or false - deprecated) means that the variable can't be overwritten, so the code _ = 'something else' would yield an error no-global-assign. If you were to instead use "_": "writable" (or "_": true - deprecated), this means that the value can be re-assigned and the previously mentioned error will not occur.

But keep in mind that this will only happen if you assign directly to the global variable as I have shown in the example. You can still shadow it and eslint won't say anything. For example, these snippets wouldn't yield the no-global-assign:

const _ = 'haha I broke your _' 

or as function argument name, e.g.

function (_) {
  console.log(_, 'might not be the _ you were looking for') 
}

Solution 2

If you are using jest for testing - in your environment - in eslintrc.json

"env":{
    "jest":true
}

Comments

[sebastian]

shouldn't you set the value to false as to forbid overwriting?

[Marko Gresak]

@sebastian it depends, there might be a case where one would want to do that. But I agree that most cases should be false, so I have added your observation to the answer. Great catch!

[Ser]

You should not use false as it is deprecated. You should write readonly instead. Source: Eslint global configuration

[Marko Gresak]

@Ser thanks for pointing this out, I have updated the answer to change false -> "readonly" and true -> "writable".