TypeScript와 Typeorm을 사용해 express 프로젝트 세팅

🧱 초기 설치

1. npm init : package.json 파일 생성
2. npm install -g typescript : grobal로 typescript 설치, 처음 프로젝트에서만 설치하면 된다.
3. tsc --init : tsconfig.json 파일 생성
4. tsconfic.json 파일 수정
5. Express에서 필요한 모듈 설치
   • npm install --save-dev @types/node
   • npm install --save express body-parser
   • npm install @types/express --save-dev
6. ts-node 설치
7. package.json에서 npm start시 시작할 파일 지정
8. typeorm 설치
   • npm install typeorm --save
   • npm install mysql --save
   • typeorm init --database mysql: ormconfig.json파일이 생성되고, tsconfig.json 파일이 수정된다.
   • ✅ 이 작업 이전에 했던 tsconfig.json 파일 수정은 다 없어지고 수정됩니다. 꼭 typeorm설치 이후에 할것!

 

🎀 tsconfig.json 의미

✅ tsconfig.json 파일은 프로젝트의 root 디렉토리에 존재해야 합니다.

설치 이후 tsconfig.json 파일

{ 
    "compilerOptions": { 
        "lib": [ "es5", "es6" ], 
        "target": "es5", 
        "module": "commonjs", 
        "moduleResolution": "node", 
        "outDir": "./build", 
        "emitDecoratorMetadata": true, 
        "experimentalDecorators": true, 
        "sourceMap": true 
    } 
}

수정한 tsconfig.json 파일

{ 
    "compilerOptions": { 
        "lib": [ "es5", "es6" ], 
        "target": "es5", 
        "module": "commonjs", 
        "moduleResolution": "node", 
        "emitDecoratorMetadata": true, 
        "experimentalDecorators": true, 
        "outDir": "./dist", 
        "rootDir": "./src", 
        "esModuleInterop": true
    } 
}

• rootDir: tsc를 실행 했을때 컴파일할 ts파일의 폴더. rootDir로 지정한 경로 안에 ts파일들 작업을 하면 됩니다.
• outDir : tsc를 실행 했을때 컴파일한 js파일이 저장될 폴더. tsc를 실행하면 자동으로 생성되므로 별도의 작업을 해줄 필요없습니다.
• sourceMap : true로 설정하면 모든 js파일마다 별도의 js.map파일이 생깁니다.

 

🎫 ts-node 설치

https://www.npmjs.com/package/ts-node

npm install -g ts-node

ts-node는 tsc를 실행하고 node로 시작해야하는 번거로움을 해결줍니다. node app.js로 시작하는 대신에 ts-node app.ts로 시작합니다. package.json에서 npm start 실행시 명령어를 아래와 같이 지정해줍니다.

"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "ts-node src/index.ts" },

"scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "start": "ts-node src/index.ts" 
},

 

🛒 ormconfig.json 설정

✅ ormconfig.json 파일은 프로젝트의 root 디렉토리에 존재해야 합니다.

처음 typeorm설정을 마치면 아래와 같이 ormconfig.json파일이 생성됩니다. 각 설정값을 맞게 수정해주면 됩니다.

만약 ts-node를 사용하지 않을 거라면(node사용 시) entities, migrations, subscribers의 경로지정에서 "dist/entity/**/*.js" 와 같이 js파일로 설정해주어야 합니다.

{ 
    "type": "mysql", 
    "host": "localhost", 
    "port": 3306, 
    "username": "test", 
    "password": "test", 
    "database": "test", 
    "synchronize": true, 
    "logging": false, 
    "entities": [ "src/entity/**/*.ts" ], 
    "migrations": [ "src/migration/**/*.ts" ], 
    "subscribers": [ "src/subscriber/**/*.ts" ], 
    "cli": { 
        "entitiesDir": "src/entity", 
        "migrationsDir": "src/migration", 
        "subscribersDir": "src/subscriber" 
    } 
}

 

⛑ 전체 프로젝트 구성

• controllers와 routes로 라우팅과 기능을 구현합니다.
• entity폴더는 node 프로젝트에서 models 폴더와 역할이 같습니다. typeorm으로 생성할 테이블에 대한 파일을 포함합니다.