패키지 번들링 및 배포

hbjs97·2022년 6월 17일
0

Nodejs 사내 저장소

목록 보기
2/2


배포할 패키지의 구조는 위와같다.

코드가 담긴 src 디렉토리
빌드된(배포될) dist 디렉토리

rollup dependency와 peer dependency 를 설치한다.

주의!
peerDependency 설치 시 npm 사용 권장
yarn은 peerDependency 를 설치해주지 않아 직접 설치해야 한다
https://github.com/yarnpkg/yarn/issues/8551
npm version 3이하 혹은 7이상은 단순히 npm i 로 설치 가능하다.

package.json
{
  "name": "배포될 패키지 명",
  "version": "1.0.0",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "module": "./dist/index.mjs",
  "scripts": {
    "build": "rollup -c"
  },
  "peerDependencies": {
    "@nestjs/common": "^8.2.6",
    "@nestjs/swagger": "^5.1.5",
    "class-transformer": "^0.5.1",
    "class-validator": "^0.13.2",
    "dayjs": "^1.10.7",
    "lodash": "^4.17.21"
  },
  "devDependencies": {
    "@babel/core": "7.12.9",
    "@rollup/plugin-alias": "^3.1.9",
    "@rollup/plugin-commonjs": "^22.0.0",
    "@rollup/plugin-json": "^4.1.0",
    "@rollup/plugin-node-resolve": "^13.3.0",
    "@types/lodash": "^4.14.178",
    "@types/validator": "^13.7.1",
    "prettier": "2.3.1",
    "rollup": "^2.75.6",
    "rollup-plugin-dts": "^4.2.2",
    "rollup-plugin-prettier": "^2.2.2",
    "rollup-plugin-typescript2": "^0.32.1",
    "rollup-plugin-uglify": "^5.0.2",
    "typescript": "^4.5.4"
  }
}

rollup.config.js 번들링 파일 생성

import alias from '@rollup/plugin-alias';
import commonjs from '@rollup/plugin-commonjs';
import json from '@rollup/plugin-json';
import resolve from '@rollup/plugin-node-resolve';
import path from 'path';
import dts from 'rollup-plugin-dts';
import typescript from 'rollup-plugin-typescript2';
import { uglify } from 'rollup-plugin-uglify';

const extensions = ['.js', '.ts'];

export default [
  {
    input: 'src/index.ts',
    /**
     * esm: es modules
     * cjs: commonjs
     */
    output: [{ file: 'dist/index.js', format: 'esm' }],

    plugins: [
      alias({
        entries: [{ find: '@', replacement: path.resolve(__dirname, 'src') }],
      }),
      json(),
      commonjs(),
      typescript({ tsconfig: 'tsconfig.json' }),
      resolve({ extensions }),
      uglify(),
    ],
  },
  // 타입 정의 파일 번들링
  {
    input: 'src/index.ts',
    output: [{ file: 'dist/index.d.ts', format: 'cjs' }],

    plugins: [
      dts(),
      alias({
        entries: [{ find: '@', replacement: path.resolve(__dirname, 'src') }],
      }),
    ],
  },
];

그리고 빌드한다.

yarn build

created dist/index.js in 8.2s
src/index.ts → dist/index.d.ts...
created dist/index.d.ts in 822ms
✨  Done in 9.52s.

dist 디렉토리에 빌드 결과물이 생성된다.

이제 배포를 하면된다.

➜  yarn publish
yarn publish v1.22.17
warning package.json: No license field
warning package.json: No license field
[1/4] Bumping version...
info Current version: 1.0.0
question New version: 1.0.0
[2/4] Logging in...
[3/4] Publishing...
success Published.
[4/4] Revoking token...
info Not revoking login token, specified via config file.
✨  Done in 6.41s.

배포를 했으니 설치해보자.

yarn add 업로드한 패키지 명


패키지의 함수가 잘 인식되는지 확인해보면 된다.


20230208
rollup을 사용하지 않고 단순히 배포하는 방식으로 수정
release-it 을 사용해 간편하게 배포, 버전관리 하는 방식을 사용중

A라는 라이브러리가 B라는 라이브러리를 의존하고 있는 경우, A 설치 시 자동으로 B 의존성이 포함되어 설치되게 하려면
A의 package.json 파일에 dependencies 항목에 B를 추가해야한다.
peerDependencies 에 B를 추가할 경우 A를 설치해도 B를 별도로 추가 설치해야한다.


20230703

이후 rollup을 제거하고, 단순 tsc 빌드 후 release-it을 사용해 배포하고있다.
release-it을 사용하면 아주 간단하게 태그를 붙이고 배포할 수 있다.

package.json 에

  "publishConfig": {
    "registry": "저장소 url"
  }

를 추가하고

.release-it.json

{
  "git": {
    "commitMessage": "chore(): release v${version}"
  },
  "github": {
    "release": true
  },
  "publishConfig": {
    "access": "restricted",
    "registry": "저장소 url"
  }
}

"build": "rimraf -fr dist && tsc -p tsconfig.json"
"release": "release-it"

0개의 댓글