Node.js에서 express 프레임워크를 활용하여 개발을 수행하던 중, Typescript를 활용하여 개발을 수행하는 중이었습니다.
처음에 컴파일하고, 코드를 실행하는 환경에서 사용한 명령어는 다음과 같습니다.
package.json
.
.
.
{
"scripts": {
"build": "npx tsc",
"start": "node index.js",
"dev": "concurrently \"npx tsc --watch\" \"nodemon -q index.js\""
}
}
npx tsc를 활용하여 typescript를 js코드로 컴파일하고, 컴파일된 js 코드를 nodemon을 활용하여 실행합니다.
(dev에서 --watch는 파일이 변경될 때마다 컴파일하기 위한 변수 = nodemon이 변경 될때마다 실행하듯)
그리고 문제는 다음과 같이 발생하였습니다.
다음의 파일구조를 가지고 있는 상황에서, account.ts파일에서 config/database/postgreSQL를 호출하려합니다.
파일 호출을 위한 import문은 다음과 같습니다.
import pool from '../config/database/postgreSQL';
상대적 경로를 통해 호출하고 있음을 알 수 있습니다.
파일의 구조가 복잡해지면 해당 방식은 상당히 별로입니다.
절대경로로 바꾸기 위해서는 어떻게 해야할까요?
절대경로의 '기준'으로 사용될 디렉터리를 필요로 합니다.
tsconfig.json
.
.
.
"baseUrl": "./src" /* Specify the base directory to resolve non-relative module names. */,
"paths": {
"@config/*": ["config/*"]
}
다음과 같은 코드에서 baseUrl이 import의 기준이 될 디렉토리의 경로입니다.
(ts.config 파일 경로를 기준으로 함)
이후 다음과 같이 import 해줍니다.
import pool from '@config/database/postgreSQL';
이렇게 하면, vscode기준으로 IDE에서는 문제가 없다고 나옵니다.
하지만 npm run dev로 실행하면,
Cannot find module '@config/database/postgreSQL'
과 같은 에러가 발생하게 됩니다.
어째서일까요?
이 글을 읽으시는 분들 대부분은 아시겠지만, nodemon은 node.js로 javascript를 실행시켜주는 명령어(npm 라이브러리)입니다.
npm run dev를 실행할 시, npx tsc로 컴파일을 수행했더라도, 결국 nodemon으로 dist 경로 내의 javascript 파일을 실행하게 됩니다.
때문에, 기본적인 nodemon으로 js 코드를 실행하는 구조에서, tsconfig를 활용하여 @config의 경로를 인식하는 것이 불가능한 것으로 보입니다.
다음 가이드라인을 최초 설치 시에 참고 했는데, nodemon만 설치합니다.
그 외에도 ts를 컴파일하고 실행하는 라이브러리로 ts-node가 존재합니다.
npm -i ts-node
ts-node를 설치하고 다시 nodemon 명령어를 실행하면 안됩니다.
tsconfig를 통해 지정한 경로가 alias(별명)지정만 해줬지, 이를 지정해준 것을 컴파일 단에서 제대로 이해시키기 위해서는
다음과 같은 코드들이 필요합니다.
npm i -D ts-node tsconfig-paths
tsconfig.json
"ts-node": {
"require": ["tsconfig-paths/register"]
},
이제 nodemon을 실행하면 정상적으로 될.......수도 있고 안 될 수도 있습니다.
nodemon이 ts-node를 인식하지 못하는 경우인데,
nodemon 입장에선 tsconfig를 필요로 하는 타입스크립트를 바꾼 js코드인지, 네이티브한 js코드인지 모르기 때문
(확실하진 않습니다요 ㅎㅎ;)
nodemon --exec ts-node 경로/index.js
혹은
nodemon 경로/index.ts
==
nodemon --exec ts-node 경로/index.ts
굿.