728x90
- NPM에서 라이브러리를 설치받는 일은 매우 빈번했지만, 내가 실제로 NPM에 라이브러리를 배포하는 경험은 없었다.
- NPM은 개인이나 팀으로 유료 요금제도 제공하여 private하게 패키지를 관리할 수 있는 기능도 제공하고 있기에, 앞으로 사용할 일이 있을 것이라 생각하고 이번에 테스트로 배포를 진행해보았다.
- 우선 npm 아이디가 필요하다.
- 회원가입을 한다.
- 그리고 배포할 패키지의 프로젝트로 이동한다.
- npm login로 로그인을 한다.
- npm publish를 입력하면 배포가 시작된다.
- 첫 배포시에는 이메일을 입력해야 한다.
- package.json에는 name, version, main 값이 반드시 필요하다.
- 만약 수정사항이 있다면, package.json에서 version값을 올리고 다시 npm publish를 한다.
다음은 내가 실제 배포한 패키지이다.
https://www.npmjs.com/package/simple-ether-wallet?activeTab=readme
🍬 만약 타입스크립트로 작성한 모듈을 배포할 때, package.json은 다음과 같이 작성할 수 있다.
{
"name": "name",
"version": "1.0.0",
"description": "citron03",
"main": "dist/index.js",
"types": "dist/index.d.ts",
"scripts": {
"build": "tsc",
"start": "node ./dist/index.js",
"dev": "ts-node ./dist/index.ts"
},
"keywords": [
"package",
],
"engines": {
"node": ">=14"
},
"author": "",
"license": "ISC",
"dependencies": {
},
"devDependencies": {
"ts-node": "^10.9.1",
"typescript": "^4.9.5"
}
}
- 모듈의 시작점인 main은 tsc를 통해서 빌드된 js 파일로 설정한다.
- 그리고 types에 d.ts 파일을 설정해주면, npm에서 TS를 내장한 모듈로 인식된다.
- tsc가 실행될 때 d.ts 파일을 자동으로 생성될 수 있도록 tsconfig.json을 다음과 같이 수정한다.
{
"include": ["src"],
"exclude": ["node_modules"],
"compilerOptions": {
"outDir": "dist",
"target": "ES6",
"rootDir": "src",
"lib": ["ES6"],
"strict": true,
"esModuleInterop": true,
"module": "CommonJS",
"declaration": true
}
}
추가해야될 옵션은 compilerOptions의 declaration로, 기본값이 false로 설정되어 있다.
true로 설정해주면, 타입스크립트 컴파일러가 실행될 때, 자동으로 각 소스파일에 대한 .d.ts 타입 파일이 생성된다.
.npmignore 파일에 npm에 배포하지 않을 파일과 폴더를 쓸 수 있다. 작성법은 .gitignore와 같은데, 만약 .npmignore 파일이 없다면 .gitignore가 그 역할을 대신한다.
즉, .npmignore 파일이 없을 땐 .gitignore에 적힌 파일과 폴더들이 배포 시 포함이 되지 않는다.
배포한 모듈을 받아 require가 아닌 import로 불러온다면, 다음과 같은 에러가 발생한다.
(node:80396) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
에러 메세지를 따라 package.json의 type을 module로 설정하거나, 확장자를 .mjs로 변경하면 된다.
728x90
'JavaScript' 카테고리의 다른 글
자바스크립트에서 배열 섞기 알고리즘 (피셔-예이츠 셔플) (0) | 2023.02.18 |
---|---|
자바스크립트 코드 실행시간 측정하기 (0) | 2023.02.11 |
javascript에서 class 사용하기 (0) | 2023.02.04 |
자바스크립트 generator 함수란? (0) | 2023.02.02 |
javascript 스코프와 실행 컨텍스트 (0) | 2023.01.31 |