Tampermonkey脚本触发ESLint no-undef错误：$未定义，求排查

这个错误很常见，本质是ESLint不知道你用的$是什么变量——它默认只识别原生JavaScript的全局对象，不认识jQuery的别名$。咱们分两种核心场景解决：

场景1：你的脚本确实需要依赖jQuery #

如果代码里的$是想用jQuery的功能，那你需要在Tampermonkey脚本的元数据区域添加@require指令，让Tampermonkey自动加载jQuery库，这样$就会被正确定义，ESLint也能识别它。

比如在脚本最顶部加上：

// ==UserScript==
// @name         你的脚本名称
// @namespace    你的命名空间
// @version      0.1
// @description  你的脚本描述
// @author       你的名字
// @match        脚本匹配的网站URL
// @require      https://code.jquery.com/jquery-3.7.1.min.js  // 这行是关键，引入jQuery
// @grant        none
// ==/UserScript==

添加后，Tampermonkey会在运行你的脚本前先加载jQuery，$就不再是未定义的变量了。

场景2：你其实不需要jQuery，只是习惯用$写法 #

如果不想依赖jQuery，完全可以把$相关的代码替换成原生JavaScript的API，这样既解决ESLint错误，又减少依赖：

• 把$('span.tag')替换为document.querySelectorAll('span.tag')
• 把$('#board, #title')替换为document.querySelectorAll('#board, #title')
• 把$(selector).each(...)换成原生的forEach遍历，比如：

  document.querySelectorAll('span.tag').forEach((span, n) => {
    // 原有的逻辑代码
  });
  

• 把$(selector).change(...)换成原生的事件监听：

  document.querySelectorAll('#board, #title').forEach(el => {
    el.addEventListener('change', (e) => {
      store(e.target.id, e.target.value);
    });
  });
  

临时绕过ESLint检测（不推荐） #

如果你只是想让ESLint闭嘴，但实际运行环境已经有jQuery（比如目标网站本身加载了jQuery），可以在脚本开头添加一行注释，告诉ESLint$是全局变量：

/* global $ */
(function() { 'use strict';
// 你的脚本代码...
})();

但这个方法只是绕过检测，如果运行环境里没有jQuery，脚本实际执行时还是会报错，所以优先推荐前面两种方案。

内容的提问来源于stack exchange，提问作者Mark B