Author: John Au-Yeung

Sometimes, we want to fix the ‘cannot redeclare block scoped variable’ error with TypeScript.

In this article, we’ll look at how to fix the ‘cannot redeclare block scoped variable’ error with TypeScript.

How to fix the ‘cannot redeclare block scoped variable’ error with TypeScript?

To fix the ‘cannot redeclare block scoped variable’ error with TypeScript, we should make sure we didn’t declare the same variable more than once.

For instance, if we write

import * as co from "./co";
const co = 1;

then we’ll get the ‘cannot redeclare block scoped variable’ error since we import a module and set its value to co and we also declared the co variable and set it to 1.

So we declared the same variable twice.

Likewise, we shouldn’t write

let co = 1;
const co = 1;

to declare a variable twice.

Conclusion

To fix the ‘cannot redeclare block scoped variable’ error with TypeScript, we should make sure we didn’t declare the same variable more than once.

Sometimes, we want to disable a TypeScript rule for a specific line.

In this article, we’ll look at how to disable a TypeScript rule for a specific line.

How to disable a TypeScript rule for a specific line?

To disable a TypeScript rule for a specific line, we can add a @ts-ignore comment.

For instance, we write

if (false) {
  // @ts-ignore: Unreachable code error
  console.log("hello");
}

to add the

// @ts-ignore: Unreachable code error

comment so the TypeScript compiler will ignore the unreachable compiler error.

Conclusion

To disable a TypeScript rule for a specific line, we can add a @ts-ignore comment.

Sometimes, we want to set a typed variable to an empty object with TypeScript.

In this article, we’ll look at how to set a typed variable to an empty object with TypeScript.

How to set a typed variable to an empty object with TypeScript?

To set a typed variable to an empty object with TypeScript, we can cast the empty object to a type with as or brackets.

For instance, we write

type User = {
  Username: string;
  Email: string;
};

const user1 = {} as User;
const user2 = <User>{};

to create a User type and cast the empty objects assigned to user1 and user2 to the User type with as or brackets respectively.

Conclusion

To set a typed variable to an empty object with TypeScript, we can cast the empty object to a type with as or brackets.

Sometimes, we want to mock dependency in Jest with TypeScript.

In this article, we’ll look at how to mock dependency in Jest with TypeScript.

How to mock dependency in Jest with TypeScript?

To mock dependency in Jest with TypeScript, we can use the jest.mock method.

For instance, we write

import * as dep from "../dependency";
jest.mock("../dependency");

const mockedDependency = <jest.Mock<typeof dep.default>>dep.default;

it("should do what I need", () => {
  mockedDependency.mockReturnValueOnce("return");
});

to call jest.mock to mock the ./dependency module.

We set the type of it with jest.Mock<typeof dep.default>

And we get the its default export with dep.default.

Conclusion

To mock dependency in Jest with TypeScript, we can use the jest.mock method.

Sometimes, we want to define a singleton in TypeScript.

In this article, we’ll look at how to define a singleton in TypeScript.

How to define a singleton in TypeScript?

To define a singleton in TypeScript, we can create a class with a getter to return the singleton instance.

For instance, we write

class MyClass {
  private static _instance: MyClass;

  private constructor() {
    //...
  }

  public static get Instance() {
    return this._instance ?? (this._instance = new this());
  }
}

const myClassInstance = MyClass.Instance;

to create the Instance static getter in the MyClass class.

We return this._instance if it’s defined or assign a new MyClass instance to this._instance and return it with

this._instance = new this()

Conclusion

To define a singleton in TypeScript, we can create a class with a getter to return the singleton instance.