Hot reload 설정

진솔·2023년 3월 24일
0

nest도 기본적으로 노드를 사용하기 때문에 코드가 수정되면 다시 껐다 켜줘야 한다.
express 를 사용할 때 nodemon이 귀찮은 문제를 해결해줬는데
Nest는 공식문서의 Hot Reload를 참고하면 된다.

공식문서 링크

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

복붙해서 설치

webpack-hmr.config.js 파일을 만들어서

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,
      }),
    ],
  };
};

공식문서가 하라는대로 복붙

src 폴더 안에 main.ts 로 가서

declare const module: any;

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

  if (module.hot) {
    module.hot.accept();
    module.hot.dispose(() => app.close());
  }
}
bootstrap();

또 하라는 대로 복붙

package.json 으로 가서

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

또 복붙

이해하려 하지 말고 공식문서가 하라는 대로 하면 됨

0개의 댓글

관련 채용 정보