ESLint đô la ($) không được xác định. (no-undef)


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

tôi thêm ESLint vào dự án của mình.

mọi thứ đều ổn, ngoại trừ biểu tượng $.

tôi gặp lỗi: [eslint] '$' is not defined. (no-undef)

của tôi .eslintrc.json(lưu ý: nó có các quy tắc bổ sung được đặt để không cho phép các hàm jquery khi có một javascript tương đương):

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

bạn có thể thấy rằng tôi đã thêm hai plugin: eslint-plugin-dollar-sign và eslint-plugin-jquery.

tại sao không hoạt động quy tắc này?

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

Câu trả lời:


211

Bạn đang mất tích

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

$không được khai báo là toàn cục nếu không jquerybật môi trường. Do đó, bạn đang gặp no-undeflỗi, nói rằng bạn đang sử dụng biến chưa được khai báo.


27

https://eslint.org/docs/user-guide/configuring#specify-enosystem

Bạn có thể chỉ định môi trường bằng cách sử dụng nhận xét bên trong tệp JavaScript của mình, sử dụng định dạng sau:

Thêm dòng bên dưới làm bình luận ở đầu tệp JavaScript của bạn.

    /* eslint-env jquery */

Eslinter sẽ ngừng ném undefined vào '$' vì nó sẽ biết bạn đang làm việc với jQuery.


1
Cảm ơn rất nhiều. Điều đó đã giúp tôi không phải thay đổi tệp cấu hình.
Divyang

Cảm ơn! Điều này rõ ràng hơn về ý định/* global $ */
Noah Sussman

20

Bạn cũng có thể thêm dòng này vào đầu tệp js của mình:

/* global $ */

Để ngăn cảnh báo trên "$" hoặc cho bất kỳ toàn cầu nào khác như "varName":

/* global varName */

12

Trong .eslintrc.js

Thêm vào

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

Xem https://eslint.org/docs/user-guide/configuring#specify-globals


1
điều này tốt cho các thư viện khác, trong trường hợp của tôi là THREEjs. Tôi đã sửa lỗi khiếu nại bằng cách thêm "globals": { "THREE": true },lời cảm ơn!
danivicario

1
Tôi đã tìm kiếm cả ngày cho giải pháp này để tìm kiếm toàn cầu webpack, đây chỉ là wbhat tôi cần. Cảm ơn bạn!
lharby

0

thêm những dòng này ở đầu tệp js của bạn -

/* eslint-env es6 */
/* eslint-disable */ 
//Function expression to select elements 
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.