ESLint-Dollar ($) ist nicht definiert. (no-undef)

94
$("#ID").hide();

Ich füge ESLint zu meinem Projekt hinzu.

Alles ist in Ordnung, außer Symbol $.

Ich bekomme eine Fehlermeldung: [eslint] '$' is not defined. (no-undef)

my .eslintrc.json(Hinweis: Es sind zusätzliche Regeln festgelegt, die JQuery-Funktionen nicht zulassen, wenn es eine entsprechende Javascript-Funktion gibt.)

{
"env": {
    "browser": true,
    "commonjs": true,
    "es6": true
},
"extends": [
    "eslint:recommended"
],
"parserOptions": {
    "sourceType": "module"
},
"plugins": [
    "dollar-sign",
    "jquery"
],
"rules": {       
    "indent": [
        "error" ,
        "tab"
    ],
    "linebreak-style": [
        "error",
        "windows"
    ],
    "quotes": [
        "error",
        "double"
    ],
    "semi": [
        "error",
        "always"
    ],
    "jquery/no-ajax": 2,
    "jquery/no-animate": 2,
    "jquery/no-attr": 2,
    "jquery/no-bind": 2,
    "jquery/no-class": 2,
    "jquery/no-clone": 2,
    "jquery/no-closest": 2,
    "jquery/no-css": 2,
    "jquery/no-data": 2,
    "jquery/no-deferred": 2,
    "jquery/no-delegate": 2,
    "jquery/no-each": 2,
    "jquery/no-fade": 2,
    "jquery/no-filter": 2,
    "jquery/no-find": 2,
    "jquery/no-global-eval": 2,
    "jquery/no-has": 2,
    "jquery/no-hide": 2,
    "jquery/no-html": 2,
    "jquery/no-in-array": 2,
    "jquery/no-is": 2,
    "jquery/no-map": 2,
    "jquery/no-merge": 2,
    "jquery/no-param": 2,
    "jquery/no-parent": 2,
    "jquery/no-parents": 2,
    "jquery/no-parse-html": 2,
    "jquery/no-prop": 2,
    "jquery/no-proxy": 2,
    "jquery/no-serialize": 2,
    "jquery/no-show": 2,
    "jquery/no-sizzle": 2,
    "jquery/no-slide": 2,
    "jquery/no-text": 2,
    "jquery/no-toggle": 2,
    "jquery/no-trigger": 2,
    "jquery/no-trim": 2,
    "jquery/no-val": 2,
    "jquery/no-wrap": 2,
    "dollar-sign/dollar-sign": [
        2,
        "ignoreProperties"
    ]
}

Sie können sehen, dass ich zwei Plugins hinzugefügt habe: eslint-plugin-dollar-sign und eslint-plugin-jquery.

Warum funktioniert diese Regel nicht?

"dollar-sign/dollar-sign": [ 2, "ignoreProperties" ]

spbsmile
quelle

Antworten:

197

Du fehlst

"env": {
  "browser": true,
  "commonjs": true,
  "es6": true,
  "jquery": true
},

$wird nicht als global ohne jqueryaktivierte Umgebung deklariert . Aus diesem Grund wird eine no-undefFehlermeldung angezeigt, dass Sie eine nicht deklarierte Variable verwenden.

Ilya Volodin
quelle
27

https://eslint.org/docs/user-guide/configuring#specifying-environments

Sie können Umgebungen mithilfe eines Kommentars in Ihrer JavaScript-Datei angeben und das folgende Format verwenden:

Fügen Sie die folgende Zeile als Kommentar am Anfang Ihrer JavaScript-Datei hinzu.

    /* eslint-env jquery */

Der Eslinter hört auf, undefiniert auf '$' zu werfen, da er weiß, dass Sie mit jQuery arbeiten.

Frank Genova
quelle
1
Vielen Dank. Das hat mich davor bewahrt, Konfigurationsdateien zu ändern.
Divyang
Vielen Dank! Dies ist in der Absicht viel klarer als/* global $ */
Noah Sussman
18

Sie können diese Zeile auch oben in Ihre js-Datei einfügen:

/* global $ */

So verhindern Sie eine Warnung über "$" oder für andere globale Elemente wie "varName":

/* global varName */
Ariel
quelle
10

Im .eslintrc.js

Hinzufügen

{
  "globals": {
    "$": true
  }
}

Siehe https://eslint.org/docs/user-guide/configuring#specifying-globals

Honghao Zhang
quelle
1
Dies ist gut für andere Bibliotheken, in meinem Fall DREIJS. Ich habe die Beschwerde behoben, indem ich mich "globals": { "THREE": true },bedankte!
Danivicario
1
Ich habe den ganzen Tag nach dieser Lösung gesucht und nach Webpack-Globals gesucht. Das ist genau das, was ich brauchte. Danke!
lharby