Eslint throws 被分配了一个值但从未使用过，webpack 模块

Question

我在 webpack 中导入一个脚本，一切正常，但 eslint 抛出错误 'modal is assigned a value but never used'。是否必须将 const 声明为全局变量或导出模块才能修复错误？

modules.vanillaModal.js :

import VanillaModal from 'vanilla-modal';

// Create instance
const modal = new VanillaModal({
  modal: '.c-modal',
  modalInner: '.js-modal__inner',
  modalContent: '.js-modal__content',
  open: '[rel="js-modal:open"]',
  close: '[rel="js-modal:close"]',
  class: 'js-modal--visible',
  loadClass: 'js-modal--loaded',
});

和我的 webpack 条目 index.js:

require('./modules.vanillaModal.js');

Answer 1

这是一个 eslint 规则 http://eslint.org/docs/rules/no-unused-vars。它可以防止您创建从未使用过的变量，这会导致代码混乱，或者可能意味着您使用的变量不是您认为的那样。

如果您使用的库设计不佳，其中 class 构造函数有副作用（这是不应该的），并且您不需要对返回值做任何事情class，我会禁用创建行的特定 eslint 规则 eslint disable comments:

// eslint-disable-next-line no-unused-vars
const modal = new VanillaModal({
  modal: '.c-modal',
  modalInner: '.js-modal__inner',
  modalContent: '.js-modal__content',
  open: '[rel="js-modal:open"]',
  close: '[rel="js-modal:close"]',
  class: 'js-modal--visible',
  loadClass: 'js-modal--loaded',
});

您还可以用特定于 eslint 的注释包裹任何代码块，以禁用该块的规则：

/* eslint-disable no-unused-vars */
const modal = new VanillaModal({
    ...
});
/* eslint-enable no-unused-vars */

Answer 2

根据 no-unused-vars 规则的文档，您应该能够只添加 EsLint 配置注释以将变量声明为 exported 以便在其他地方使用。

/*exported modal*/
const modal = new VanillaModal({
  modal: '.c-modal',
  modalInner: '.js-modal__inner',
  modalContent: '.js-modal__content',
  open: '[rel="js-modal:open"]',
  close: '[rel="js-modal:close"]',
  class: 'js-modal--visible',
  loadClass: 'js-modal--loaded',
});

它也适用于常量。

我发现这比再次禁用和重新启用规则更好，因为我只需要一条评论而不是两条。

Answer 3

你有 .eslintrc.js 文件吗？

只需添加：

"rules": {
    "no-unused-vars": 0
}

Answer 4

将 "varsIgnorePattern:" 添加到 .eslintrc 文件

"no-unused-vars": ["warn", { "varsIgnorePattern": "VARIABLE_NAME"}]

https://eslint.org/docs/rules/no-unused-vars#varsignorepattern

Eslint throws 被分配了一个值但从未使用过，webpack 模块

Eslint throws is assigned a value but never used , webpack module

javascript

eslint

webpack