나의 NPM 패키지 만들기

$ npm init

{
  "name": "@bbon/formatter",
  "version": "1.0.0",
  "description": "Format the entered values.",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/bbonkr/bbon-formatter.git"
  },
  "homepage": "https://github.com/bbonkr/bbon-formatter",
  "bugs": {
    "url": "https://github.com/bbonkr/bbon-formatter/issues"
  },
  "keywords": ["formatting", "string", "utility"],
  "author": "Pon Cheol Ku <dev@bbon.kr> (http://bbon.kr)",
  "license": "MIT"
}

$ npm install --save-dev typescript eslint prettier @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier eslint-plugin-import eslint-plugin-prettier jest @types/jest @types/node ts-jest

{
  "semi": true,
  "trailingComma": "all",
  "singleQuote": true,
  "printWidth": 80,
  "tabWidth": 4
}

{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "extends": [
    "plugin:@typescript-eslint/recommended",
    "prettier",
    "prettier/@typescript-eslint",
    "plugin:prettier/recommended"
  ],
  "parserOptions": {
    "ecmaVersion": 2018, // Allows for the parsing of modern ECMAScript features
    "sourceType": "module" // Allows for the use of imports
  },
  "rules": {
    "no-console": "warn"
  }
}

dist/

node_modules/
dist/
.jest/

$ npx tsc --init

{
  "compilerOptions": {
    /* Basic Options */
    "target": "es5",
    "module": "commonjs",
    "declaration": true,
    "outDir": "./dist",
    "strict": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true
  },
  "exclude": ["__test__", "./**/*.spec.ts", "dist"]
}

/**
 * 포맷팅 기능을 제공합니다.
 *
 * @export
 * @class StringFormatter
 */
export class StringFormatter {
  /**
   * 숫자에 1000 단위 구분자를 추가해서 문자열로 출력합니다.
   *
   * @param {(number | string)} value
   * @param {string} delimiter 구분자; 기본값: **,** 콤마 문자
   * @returns {string}
   * @memberof StringFormatter
   */
  public NumberWithDelimiter(value: number | string, delimiter = ","): string {
    let stringValue = "";
    let fraction = "";
    if (typeof value === "number") {
      stringValue = value.toString();
    }

    if (typeof value === "string") {
      stringValue = value;
    }

    if (stringValue.indexOf(".") >= 0) {
      const splittedValue = stringValue.split(".");

      if (splittedValue.length > 1) {
        stringValue = splittedValue[0];
        fraction = splittedValue[1];
      }
    }

    stringValue = stringValue.replace(/\B(?=(\d{3})+(?!\d))/g, delimiter);

    return `${stringValue}${fraction ? `.${fraction}` : ""}`;
  }
}

export { StringFormatter } from "./StringFormatter";

import { StringFormatter } from "./StringFormatter";

describe("StringFormatter", () => {
  const formatter = new StringFormatter();
  it("세자리마다 구분자가 추가된 숫자 형식의 문자열", () => {
    expect(formatter.NumberWithDelimiter(1000)).toBe("1,000");
  });

  it("큰 숫자도 세자리마다 구분자가 추가된 숫자 형식의 문자열", () => {
    expect(formatter.NumberWithDelimiter(12345678901234)).toBe(
      "12,345,678,901,234"
    );
  });

  it("소수점 아래 값은 구분자가 추가되지 않습니다.", () => {
    expect(formatter.NumberWithDelimiter(1000.1234)).toBe("1,000.1234");
  });

  it("숫자형식의 문자열을 입력하면 세자리마다 구분자가 추가된 숫자 형식의 문자열", () => {
    expect(formatter.NumberWithDelimiter("1000")).toBe("1,000");
  });

  it("숫자형식의 문자열을 입력하면 소수점 아래 값은 구분자가 추가되지 않습니다.", () => {
    expect(formatter.NumberWithDelimiter("1000.1234")).toBe("1,000.1234");
  });

  it("빈 분자열은 빈 문자열을 반환합니다.", () => {
    expect(formatter.NumberWithDelimiter("")).toBe("");
  });
});

{
  // ... 이전 내용
  "jest": {
    "transform": {
      "^.+\\.(ts|tsx)$": "ts-jest"
    },
    "globals": {
      "ts-jest": {
        "tsConfig": "tsconfig.json"
      }
    },
    "testRegex": "\\.(test|spec)\\.((js|ts))$",
    "setupFilesAfterEnv": ["./__test__/setup.ts"],
    "cacheDirectory": "./.jest/cache"
  }
}

{
  // ... 이전내용
  "scripts": {
    "test": "jest",
    "build": "tsc",
    "lint": "eslint ./src/**/*.ts",
    "lint:fix": "eslint ./src/**/*.ts --fix"
  }
}

$ npm run build

$ npm run test

> @bbon/formatter@1.0.1 test D:\repos\formatter
> jest

 PASS  src/StringFormatter.spec.ts
  StringFormatter
    √ 세자리마다 구분자가 추가된 숫자 형식의 문자열 (1ms)
    √ 큰 숫자도 세자리마다 구분자가 추가된 숫자 형식의 문자열
    √ 소수점 아래 값은 구분자가 추가되지 않습니다. (1ms)
    √ 숫자형식의 문자열을 입력하면 세자리마다 구분자가 추가된 숫자 형식의 문자열
    √ 숫자형식의 문자열을 입력하면 소수점 아래 값은 구분자가 추가되지 않습니다.
    √ 빈 분자열은 빈 문자열을 반환합니다.

Test Suites: 1 passed, 1 total
Tests:       6 passed, 6 total
Snapshots:   0 total
Time:        1.646s, estimated 3s
Ran all test suites.

__test__/
src/
.jest/
.eslintignore
.eslintrc
.prettierrc
tsconfig.json

{
  // ...이전 내용
  "main": "dist/index.js",
  "types": "dist/index.d.ts"
}

$ npm login

$ npm config ls

$ npm run build

$ npm publish --access public

{
    // ... 이전내용
    "version": "1.0.1"
}

$ npm publish --access public

$ npm install --save @bbon/formatter

프로젝트 디렉터리
│  index.js
│  package-lock.json
│  package.json
│
└─node_modules
    └─@bbon
        └─formatter
            │  LICENSE
            │  package.json
            │  README.md
            │
            └─dist
                    index.d.ts
                    index.js
                    StringFormatter.d.ts
                    StringFormatter.js