tslint-disable comment in method chains

Question

I am populating an Array and using it to map onto a sequence of React components

    return (
        <div className={style}>
            <Header title="INVENTORY" />
            {Array(slots)
                .fill(0)
                .map((_, i) => (
                    <ItemSlot />
                ))}
        </div>
    )

this line .map((_, i) => ( shows warnings

'_' is defined but never used.eslint@typescript-eslint/no-unused-vars

'i' is defined but never used.eslint@typescript-eslint/no-unused-vars

I attempt to add the /* tslint:disable:no-unused-variable */ comment, but it doesn't seem to work anywhere I've tried to put it. For example

                .fill(0) /* tslint:disable:no-unused-variable */
                .map((_, i) => (
                    <ItemSlot />
                ))}

has no effect.

How can I add tslint comment overrides on methods being chained?

Answer 1

If you aren't using the variables you can just omit them:

Array(slots)
  .fill(0)
  .map(() => (
    <ItemSlot />
  ))

Answer 2

There are a few problems with your question.

First off - you've got your tools mixed up. tslint is one tool and eslint is another. The errors you've listed are coming from eslint, not tslint.

Because you've got your wires crossed - you're attempting to use a tslint disable comment instead of an eslint disable comment. ESLint disables look like

// eslint-disable-next-line <name of rule>
// eslint-disable-line <name of rule>

i.e.

// eslint-disable-next-line @typescript-eslint/no-unused-var
// eslint-disable-line @typescript-eslint/no-unused-var

Next - as John mentioned in his answer - if you're not using any of the arguments - then there's no need to declare them at all - you can (and should) just omit them entirely as they are unnecessary cruft.

Finally - if you want the rule to ignore underscore named arguments, you can use the argsIgnorePattern option, eg:

"@typescript-eslint/no-unused-vars": ["error", { "argsIgnorePattern": "^_" }]