Typescript disable next line

TSLint rule flags

In addition to global configuration, you may also enable/disable linting for a subset of lint rules within a file with the following comment rule flags:

• /* tslint:disable */ — Disable all rules for the rest of the file
• /* tslint:enable */ — Enable all rules for the rest of the file
• /* tslint:disable:rule1 rule2 rule3. */ — Disable the listed rules for the rest of the file
• /* tslint:enable:rule1 rule2 rule3. */ — Enable the listed rules for the rest of the file
• // tslint:disable-next-line — Disables all rules for the following line
• someCode(); // tslint:disable-line — Disables all rules for the current line
• // tslint:disable-next-line:rule1 rule2 rule3. — Disables the listed rules for the next line
• etc.

Rules flags enable or disable rules as they are parsed. Disabling an already disabled rule or enabling an already enabled rule has no effect. Enabling a rule that is not present or disabled in tslint.json has also no effect.

For example, imagine the directive /* tslint:disable */ on the first line of a file, /* tslint:enable:ban class-name */ on the 10th line and /* tslint:enable */ on the 20th. No rules will be checked between the 1st and 10th lines, only the ban and class-name rules will be checked between the 10th and 20th, and all rules will be checked for the remainder of the file.

function validRange (range: any)  return range.min  range.middle && range.middle  range.max; > /* tslint:disable:object-literal-sort-keys */ const range =  min: 5, middle: 10, // TSLint will *not* warn about unsorted keys here max: 20 >; /* tslint:enable:object-literal-sort-keys */ const point =  x: 3, z: 5, // TSLint will warn about unsorted keys here y: 4, > console.log(validRange(range)); 

Источник

Typescript disable next line

Last updated: Jan 23, 2023
Reading time · 2 min

# Ignore errors using // @ts-ignore

Use // @ts-ignore to ignore the type checking errors on the next line in a TypeScript file.

If you use a linter, you might have to add a comment to also suppress linting errors when using ts-ignore .

Copied! 
// eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore function sum(a, b)  return a + b; > 

The // @ts-ignore comment ignores all type checking errors for a single line.

The function’s parameters are not typed, however, no error is raised because we used the comment.

# Ignore errors using // @ts-expect-error

The @ts-expect-error comment can also be used to ignore errors for a single line.

Copied! 
// eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-expect-error function sum(a, b)  return a + b; > 

The // @ts-expect-error will ignore all type errors on the next line, but if there aren’t any errors, TypeScript will inform us that using @ts-expect-error was unnecessary.

Copied! 
// eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-expect-error console.log('bobbyhadz.com' / 0); // ⛔️ Error: Unused '@ts-expect-error' directive.ts(2578) // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-expect-error console.log(100 * 100); 

# When to use ts-ignore and ts-expect-error

That’s the main difference between ts-ignore and ts-expect-error — // @ts-ignore doesn’t alert us if the next line has no errors.

For example, you would use @ts-expect-error if you have a function that takes a parameter of type string , but need to test it with parameters of different types.

Copied! 
function logMessage(message: string)  if (typeof message !== 'string')  return 'message has to be a string'; > console.log(message); return message; > // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-expect-error const result = logMessage(42); if (result === 'message has to be a string')  console.log('test successful'); > 

The logMessage function in the example takes a parameter of type string . However, we want to test if the function does what we expect when invoked with a number .

If we don’t add the @ts-expect-error comment, we will get a type checking error, because the function expects a string , and not a number .

This way we can still test our function, and we will get alerted if there is no need for a @ts-expect-error comment.

# Ignore all errors in a file

Use the @ts-nocheck comment to ignore all type checking errors in a file.

Copied! 
// eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-nocheck function sum(a, b)  return a + b; > 

You often have to ignore type checking errors for an entire file when your project has type checking for JavaScript files enabled.

If you don’t use a linter or don’t use any rules that prevent you from using ts comments, remove the line.

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.

Источник

How to Ignore and Disable TypeScript Rules

This tutorial provides syntax for ignoring lint rules at the line, file, and package level. I focus on syntax for TypeScript-ESLint but will include TSLint and ESLint commands.

TSLint was deprecated in late 2019 in favor of typescript-eslint. The combined linter is a good idea because both TSLint and ESLint are linters and many people want the functionality they both provide. ESLint on its own is still a great linter for developers who are not using TypeScript.

Here is the different syntax for disabling next line rules:

• @ts-ignore – TypeScript-ESLint syntax for ignoring TypeScript rules
• eslint-disable-next-line – ESLint and TypeScript-ESLint syntax for disabling non-ts rules
• tslint:disable-next-line – deprecated TSLint syntax

This can be tricky stuff. Also, remember that these are presented as comments in the code:

• Ignoring specific rules
• Disabling lint rules for a block of code
• Re-enabling lint rules
• Several methods for controlling file-level rule checking

Related: Test your TypeScript knowledge against these 50 difficult TypeScript questions.

I’ll start with several methods of how to disable linting, because the how is factual. Then when is more opinionated, so take that with a grain of salt.

The Resources section has a Code Sandbox link with live tutorial code that shows these rules being used.

How To Ignore Next Line With TypeScript-ESLint

There are two primary commands for ignoring the next TypeScript line:

• @ts-ignore : Ignore a single line with @ts-ignore . This actually will ignore a statement, which may be more than a single line. However, it will not ignore an entire block.

// @ts-ignore const useStyles = makeStyles((theme) => ( < root: < display: "flex", flexDirection: "rowssss" >>));

• @ts-expect-error : Tell the compiler to expect an error (and throw an error if no error actually occured) with @ts-expect-error . An example usage from the TypeScript docs: if your unit tests are written in TypeScript, but you actually want to write a ‘breaking’ test, you can’t…unless you tell the compiler to expect an error. Simply put, this directive is more specific than @ts-ignore .

When To Use ts-expect-error Or ts-ignore

Based on the search volume I see for different keywords, most people use @ts-ignore . It’s simpler to understand and gets the job done.

The TypeScript team has these guidelines on when to use @ts-expect-error instead of @ts-ignore . The most important guideline: if you plan to fix code instead of leaving suppression errors, then use @ts-expect-error .

How To Ignore Next Line With ESLint

This does not disable TypeScript rules and should not be used in files ending in .tsx. It does work in .js or .jsx files in projects with TypeScript-ESLint enabled or with standard ESLint enabled.

Here’s an example where the myName const is never used and I disable the ESLint warning.

// eslint-disable-next-line no-unused-vars const myName = 'Jon';

Notice the specifier of no-unused-vars . This leaves all other TypeScript and ESLint rules enabled and only disables the specific rule. You can read more about ESLint rules here.

How To Ignore Next Line With TSLint

Only use this suppression comment if you are still using TSLint.

If you are not sure which linter you are using, check your package.json. If you see @tslint , you are using the old deprecated TypeScript linter. If you see @typescript-eslint , you are using the linter currently recommended by Palantir, the creators of TSLint.

How To Ignore File Rules With TypeScript-ESLint

• @ts-nocheck Tell the compiler to skip type checking for an entire file with @ts-nocheck . Interestingly, the opposite of this is @ts-check , which can be used to turn on type-checking for non-TypeScript files.
• ^^^Notice the syntax for the above directives did not change with the move from TSLint to typescript-eslint.
• Ignore ‘normal’ (non-TypeScript) ESLint rules: ignore multiple lines with /* eslint:disable */ and /* eslint:enable */

/* eslint-disable @typescript-eslint/no-unused-vars */ const str: string = "asda";
const str2: string = "asda2";
/* eslint-enable @typescript-eslint/no-unused-vars */

@ts-expect-error
@ts-ignore
@ts-nocheck
@ts-check