ESLint - "window" is not defined. How to allow global variables in package.json

eslint

I am assigning a property to the global window object, but when I run eslint, I get this:

"window" is not defined

the following defines window as a global variable for code that should not trigger the rule being tested:

valid: [
  {
    code: "window.alert()",
    globals: [ "window" ]
  }
]

I've tried adding something like this to the package.json file to have eslint allow "window" as a global variable, but I must be doing something wrong. From the docs it seems like I might need to do something like this in a separate file, but is there a way to define some allowed global variables right in the package.json file?

FYI, if you're using node and want ESLint to recognize global then you need to ensure "node": true is set under your "env" configuration.

I believe it would be nice to have stackoverflow.com/a/32481806/9888500 as the default answer as it's the most accurate one?

Laoujin

There is a builtin environment: browser that includes window.

Example .eslintrc.json:

"env": {
    "browser": true,
    "node": true,
    "jasmine": true
  },

More information: https://eslint.org/docs/user-guide/configuring/language-options#specifying-environments

Also see the package.json answer by chevin99 below.

Absolutely the best answer, thanks. I didn't even think of that :)

Just in case someone else gets caught out like me: This should be in .eslintrc not package.json

Is there a way of making this only apply to one file?

I found the following in the answer by Carles Alcolea below: Add at the top of this one file: /* eslint-env browser */

That can be in package.json under "eslintConfig" as well.

simonzack

I found it on this page: http://eslint.org/docs/user-guide/configuring

In package.json, this works:

"eslintConfig": {
  "globals": {
    "window": true
  }
}

the right way to do it is to use "env":{"browser": true}

@Nicolas, yep, I probably would've used the method you suggested if that's what I had found first, but this answer is at least useful in showing you can have your eslint config in package.json.

It's also possible to inline globals for eslint like this: /*global angular: true */

the question specifically asks how to use the package.json file though

Neithan Max

Add .eslintrc in the project root.

{
  "globals": {
    "document": true,
    "foo": true,
    "window": true
  }
}

Somehow placing eslingConfig in package.json didn't work for me (apart from being conceptually wrong). Adding it in .eslintrc.json works though.

@Petrunov .eslintrc.json can just be .eslintrc

this doesn't work in one case i'm experiencing - i am using eslint with gulp for a chrome extension project. in globals i set "chrome": true and it still throws an error about it being an unrecognized global.

Razzi Abuissa

Your .eslintrc.json should contain the text below. This way ESLint knows about your global variables.

{
  "env": {
    "browser": true,
    "node": true
  }                                                                      
}

Neithan Max

I'm aware he's not asking for the inline version. But since this question has almost 100k visits and I fell here looking for that, I'll leave it here for the next fellow coder:

Make sure ESLint is not run with the --no-inline-config flag (if this doesn't sound familiar, you're likely good to go). Then, write this in your code file (for clarity and convention, it's written on top of the file but it'll work anywhere):

/* eslint-env browser */

This tells ESLint that your working environment is a browser, so now it knows what things are available in a browser and adapts accordingly.

There are plenty of environments, and you can declare more than one at the same time, for example, in-line:

/* eslint-env browser, node */

If you are almost always using particular environments, it's best to set it in your ESLint's config file and forget about it.

From their docs:

An environment defines global variables that are predefined. The available environments are: browser - browser global variables. node - Node.js global variables and Node.js scoping. commonjs - CommonJS global variables and CommonJS scoping (use this for browser-only code that uses Browserify/WebPack). shared-node-browser - Globals common to both Node and Browser. [...]

Besides environments, you can make it ignore anything you want. If it warns you about using console.log() but you don't want to be warned about it, just inline:

/* eslint-disable no-console */

You can see the list of all rules, including recommended rules to have for best coding practices.

AndreaM16

If you are using Angular you can get it off with:

"env": {
    "browser": true,
    "node": true
},
"rules" : {
    "angular/window-service": 0
 }

ESLint - "window" is not defined. How to allow global variables in package.json

Follow WeChat

Want to stay one step ahead of the latest teleworks?

相似问题

Platform

Support

Contact US