TSLint plugin bringing support for the override keyword
Finally brings support for the override
keyword to TypeScript!
export class Basic {
public overridePlease(): void { }
public doNotOverride(): void { }
}
export class Child extends Basic {
public doNotOverride(): void { } // ERROR: Method Child#doNotOverride is overriding Basic#doNotOverride. Use the @override JSDoc tag if the override is intended
// Make it explicit that you intend to override this member
/** @override */ public overridePlease(): void { }
// Alternatively, you can use the decorator syntax
@override public overridePlease(): void { }
// Typos won't bother you anymore
/** @override */ public overidePlease(): void { } // ERROR: Method with @override tag is not overriding anything
}
Most modern object oriented languages provide an override
keyword to prevent misuse of the override mechanism. However, support for the override
keyword in TypeScript is nowhere in sight, and in the meantime, TypeScript programmers are left with no ideal solution to this problem.
Here are some reasons to use this rule:
npm install --save-dev tslint-override
Then, in your tslint.json
, extend the tslint-override configuration.
{
"extends": [
"tslint-override"
]
}
By default, tslint-override
checks all members inherited or defined by any object in the heritage chain. You can opt out of interface
checking. In that case, tslint-override
will only look at parent class
es.
{
"extends": [
"tslint-override"
],
"rules": {
"explicit-override": [ true, "exclude-interfaces" ]
}
}
If you want to use the decorator syntax, you will need the override
decorator in your scope. There are two ways to do this:
tslint-override
do the jobIn your application entry point, include the following import.
import 'tslint-override/register';
You can then use @override
anywhere else in your code:
class Foo extends Basic {
@override public doStuff() { }
}
Alternatively, you can define it yourself, but make sure it is in scope where you need it.
function override(_target: any, _propertyKey: string, _descriptor?: PropertyDescriptor) { /* noop */ }
If your love for java will never die, you can define this with a capital 'O' and use @Override
in your code instead.
Both jsdoc tags and decorators are accepted by default. If you want to force one and ignore the other, specify either the decorator
or jsdoc
parameter like this:
"rules": {
"explicit-override": [ true, "decorator" ]
}
By default, the fixer adds jsdoc tags. Specifying the decorator
option will also change that to use decorators.
@Override
fixerLinting will accept both @override
and @Override
jsdoc tags or decorators, but the fixer defaults to adding @override
. This can be changed with the pascal-case-fixer
option.
{
"extends": [
"tslint-override"
],
"rules": {
"explicit-override": [ true, "pascal-case-fixer" ]
}
}
Note: tslint-override/register
does not support the PascalCase @Override
decorator, so you will have to define it yourself.
If you want the fixer to put a new line after the tag use the new-line-after-decorators-and-tags
option.
{
"extends": [
"tslint-override"
],
"rules": {
"explicit-override": [ true, "new-line-after-decorators-and-tags" ]
}
}
or
{
"extends": [
"tslint-override"
],
"rules": {
"explicit-override": [ true, "decorator", "new-line-after-decorators-and-tags" ]
}
}
tslint-override
offers an angular-friendly decorator syntax, where the decorator is called with a pair of parenthesis.
import 'tslint-override/angular-register';
You can then use @Override()
or @override()
anywhere in your code:
class Foo extends Basic {
@Override() public doStuff() { }
}
Add the setting angular-syntax-fixer
to let tslint know to use parenthesis when fixing code.
{
"extends": [
"tslint-override"
],
"rules": {
"explicit-override": [ true, "decorator", "angular-syntax-fixer", "pascal-case-fixer" ]
}
}
This rule requires type information. If you are still using vscode-tslint you should switch over to using the tslint-language-service because vscode-tslint won't show the errors reported by tslint-override.
Example in VSCode:
Created and maintained by @hmil.
Contributions:
pascal-case-fixer
option.exclude-interfaces
option.new-line-after-decorators-and-tags
option.License: MIT
Please star this repo if you like it, and submit code and issues if something doesn't work.