[TIL] Nest.js | Hot reload 설정하기

sooyoung choi·2023년 12월 24일
0

nestjs

목록 보기
4/4
post-thumbnail

🔥 Hot reload 설정해주기 (nest-cli 사용 버전)

  • 매번 서버를 껐다 켰다 하기 번거로워 공식문서 참고하며 설정해줬다.
  • Nodemon과 비슷한 역할

1) 설치

 npm i --save-dev webpack-node-externals run-script-webpack-plugin webpack

2) webpack-hmr.config.js 파일을 root 디렉토리에 생성해준다.

const nodeExternals = require('webpack-node-externals');
const { RunScriptWebpackPlugin } = require('run-script-webpack-plugin');

module.exports = function (options, webpack) {
  return {
    ...options,
    entry: ['webpack/hot/poll?100', options.entry],
    externals: [
      nodeExternals({
        allowlist: ['webpack/hot/poll?100'],
      }),
    ],
    plugins: [
      ...options.plugins,
      new webpack.HotModuleReplacementPlugin(),
      new webpack.WatchIgnorePlugin({
        paths: [/\.js$/, /\.d\.ts$/],
      }),
      new RunScriptWebpackPlugin({
        name: options.output.filename,
        autoRestart: false,
      }),
    ],
  };
};

3) main.ts 파일에 관련 코드를 작성한다.

declare const module: any; // hot reload 관련 추가 코드
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { ValidationPipe } from '@nestjs/common';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);

  ...
 
  // hot reload 관련 추가 코드
  if (module.hot) {
    module.hot.accept();
    module.hot.dispose(() => app.close());
  }
}
bootstrap();

4) package.json 파일을 수정해준다.

 "start:dev": "nest build --webpack --webpackPath webpack-hmr.config.js --watch",

5) 터미널에서 실행해준다.

npm run start:dev


참고 사이트: https://docs.nestjs.com/recipes/hot-reload#installation

0개의 댓글