Create a project

Create a new project directory and initialise it

$ mkdir kata-project

$ cd kata-project

$ npm init --yes

or

$ npm init -y

Initialise TypeScript

$ npx tsc --init

Created a new tsconfig.json with:
                                                                                 TS
  target: es2016
  module: commonjs
  strict: true
  esModuleInterop: true
  skipLibCheck: true
  forceConsistentCasingInFileNames: true


You can learn more at https://aka.ms/tsconfig

Install prettier for code formatting

eslint no longer support code formatting and direct user to use prettier: https://eslint.org/blog/2023/10/deprecating-formatting-rules/

Most eslint reported error already covered by TypeScript

Most rule in eslint website will show this note

Follow the instruction from this page: https://prettier.io/docs/install

$ npm install --save-dev --save-exact prettier

or

$ npm i -D prettier

Setting up Prettier

Option 1

Follow the instruction on Prettier website:

$ node --eval "fs.writeFileSync('.prettierrc','{}\n')"

$ node --eval "fs.writeFileSync('.prettierignore','# Ignore artifacts:\nbuild\ncoverage\n')"

Option 2

Add the following to package.json

{
  "prettier": {
    "trailingComm": "es5",
    "tabWidth": 2,
    "singleQuote": true,
    "semi": false
  },
}

Then make sure that Automatic Prettier configuration is selected.

In WebStorm, the keyboard shortcut to Reformat with Prettier is: ⌥ ⇧ ⌘ P

Will look into how to pick a “coding style” to use with Prettier in the future.

Install Vitest

$ npm install --save-dev vitest

or

$ npm i -D vitest

Vitest can be used out of the box without any configuration.

Write the test

import { describe, expect, it } from "vitest";
import { add } from "../src/math";

describe("math", () => {
  it("should add two numbers", () => {
    expect(add(2, 3)).toBe(5);
  });
});

Unlike Jest, Vitest knows about TypeScript and do not require extra library (i.e. ts-jest) or configuration (i.e. jest.config.js)

You need to import describe, expect, and it if we don’t “register” it globally.

import { describe, expect, it } from "vitest";

Implementation of the test will be omitted for brevity reason.