Cannot find module 'eslint-plugin-angular'

Question

I'm trying to integrate ESLint into my project and I'm running into the error: "Cannot find module 'eslint-plugin-angular'" when I run $ eslint *.js.

The only way I can get this to run is by installing eslint-plugin-angular globally, but that seems wrong (unless I'm missing something??).

I'm running:

• node v0.12.7
• npm 3.3.4
• eslint v1.5.0
• eslint-plugin-angular 0.12.0

ESLint is installed globally.

My package.json file has the following entries:

• "eslint": "^1.5.0",
• "eslint-plugin-angular": "^0.12.0",

I have $ rm -rf node_modules and rerun $ npm install to make sure there wasn't some kind of npm dependency issue or corruption. I also verified the directory permissions in node_modules to make sure access is possible.

My .eslintrc contains:

{
    "plugins": [
        "angular"
    ],
    "rules": {
    "angular/ng_controller_name": [
        2,
        "/[A-Z].*Controller$/"
    ],
    "quotes": [
        2,
        "single"
    ]
    },
        "globals": {
        "angular": true
    }
}

What am I missing here? Thx! ps. I did open a ticket on github: https://github.com/Gillespie59/eslint-plugin-angular/issues/222 -- just wondering if someone in the Stack community has run into this.

Answer 1

You are pretty much guaranteed to run into this problem if you follow a guide that tells you to use npm install -g eslint, which is the recommended way to install ESLint, and then proceeds to immediately tell you to use eslint --init to create a configuration for your project. The issue is that eslint --init will install the packages you need, but it will install them locally, even if it is being run from a globally installed eslint. I was none the wiser until I tried editing a file in Emacs and flycheck reported an error from ESLint:

Error: Failed to load plugin react: Cannot find module 'eslint-plugin-react'
    at Function.Module._resolveFilename (module.js:325:15)
    at Function.Module._load (module.js:276:25)
[...]

I like to allow both a global installation and a local one. I might use the global one for experimental code that I still want to be checked but does not belong to any specific project, and local installations with more specific needs. So I created a script stored as ~/bin/eslint. Since ~/bin is early on my PATH, this script is used in place of any globally install eslint:

#!/bin/sh

# Find the top of the code hierarchy, and move there.
prefix=`npm prefix`
[ -n $prefix ] && cd $prefix

# Execute the local eslint if it exists.    
local_eslint=./node_modules/.bin/eslint
[ -x $local_eslint ] && exec $local_eslint "$@"

# If not, execute the global one.
exec /path/to/global/eslint "$@"

(For those who don't know, exec is final. If the first exec is executed then nothing after it will execute.)

This script assumes an project structure suitable for npm (i.e. there's a package.json that npm prefix can find). It would have to be adapted to other situations.

My global eslint is in an unusual location, adapt the script to point it to where you have it installed.

Answer 2

Found the answer here: http://eslint.org/docs/user-guide/configuring#configuring-plugins

"Note: A globally-installed instance of ESLint can only use globally-installed ESLint plugins. A locally-installed ESLint can make sure of both locally- and globally- installed ESLint plugins."

This falls under read the fine print in the documentation. :/

There are two ways to deal with this:

(1) Install the plugin(s) globally. I'm not a particular fan of this because I have multiple client projects that are on different versions of dependencies and I can't necessarily just bump them all to the same version.

(2) Install the plugin(s) locally and add a script to your package.json file:

{
    ... other stuff
    "scripts": {
        "eslint": "eslint",
        "lint": "eslint. "
    }
    ... other stuff
}

(If you're completely new to this, just keep in mind that ... other stuff isn't what you'd actually want in your package.json file...)

With this setup, I'm able to use npm run eslint to use eslint and I use npm run lint to actually lint my project.

You can find documentation on the scripts field for the package.json file here: https://docs.npmjs.com/misc/scripts