ESLintドル($)は定義されていません。(undefなし)


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

ESLintをプロジェクトに追加します。

記号を除いて、すべて問題ありません$

エラーが発生します: [eslint] '$' is not defined. (no-undef)

my .eslintrc.json(注:同等のjavascript関数がある場合にjquery関数を禁止するように設定された追加のルールがあります):

{
"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"
    ]
}

eslint-plugin-dollar-signとeslint-plugin-jqueryの2つのプラグインを追加したことがわかります。

なぜこのルールが機能しないのですか?

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

回答:


211

あなたは行方不明です

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

$jquery環境が有効になっていないグローバルとして宣言されていません。そのため、no-undef宣言されていない変数を使用しているというエラーが発生します。


27

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

JavaScriptファイル内のコメントを使用して環境を指定できます。次の形式を使用してください。

JavaScriptファイルの先頭にコメントとして以下の行を追加します。

    /* eslint-env jquery */

eslinterは、jQueryを使用していることがわかるため、「$」で未定義のスローを停止します。


1
どうもありがとう。これにより、構成ファイルを変更する必要がなくなりました。
Divyang

ありがとう!これは、意図がはるかに明確です/* global $ */
Noah Sussman

20

この行をjsファイルの先頭に追加することもできます。

/* global $ */

「$」または「varName」などの他のグローバルに対する警告を防ぐには、次のようにします。

/* global varName */

12

.eslintrc.js

追加

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

https://eslint.org/docs/user-guide/configuring#specifying-globalsを参照してください


1
これは他のライブラリ、私の場合はTHREEjsに適しています。"globals": { "THREE": true },感謝を込めてエスリントの文句を直しました!
danivicario

1
webpackグローバルを探してこのソリューションを一日中探していましたが、これは私が必要としていたものです。ありがとう!
lharby

0

これらの行をjsファイルの先頭に追加します-

/* eslint-env es6 */
/* eslint-disable */ 
//Function expression to select elements 
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.