ไม่ได้กำหนด ESLint ดอลลาร์ ($) (no-undef)


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

ฉันเพิ่ม ESLint ในโครงการของฉัน

$ทุกอย่างดียกเว้นสัญลักษณ์

ฉันได้รับข้อผิดพลาด: [eslint] '$' is not defined. (no-undef)

ของฉัน.eslintrc.json(หมายเหตุ: มีกฎเพิ่มเติมที่ตั้งค่าให้ไม่อนุญาตฟังก์ชัน 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

ทำไมกฎนี้ไม่ทำงาน

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

คำตอบ:


215

คุณหายไป

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

$ไม่ได้ประกาศเป็นโกลบอลโดยไม่jqueryเปิดใช้งานสภาพแวดล้อม ด้วยเหตุนี้คุณจึงได้รับno-undefข้อผิดพลาดโดยบอกว่าคุณกำลังใช้ตัวแปรที่ยังไม่ได้ประกาศ


29

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

คุณสามารถระบุสภาพแวดล้อมโดยใช้ความคิดเห็นภายในไฟล์ 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 ฉันแก้ไขการบ่น eslint โดยการเพิ่ม"globals": { "THREE": true },ขอบคุณ!
danivicario

1
ค้นหาวิธีแก้ปัญหานี้มาทั้งวันโดยมองหา webpack globals นี่เป็นเพียงสิ่งที่ฉันต้องการ ขอบคุณ!
lharby

0

เพิ่มบรรทัดเหล่านี้ที่ด้านบนของไฟล์ js ของคุณ -

/* eslint-env es6 */
/* eslint-disable */ 
//Function expression to select elements 
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.