CODEWITHSUNDEEP
node.jswebpack-dev-servernestjs
José Gabriel González
José Gabriel González

Reputation: 338

Nest.js framework hot reload doesn't work

I've followed the steps of the documentation:

https://docs.nestjs.com/techniques/hot-reload

I'm running this command: npm run webpack but it closes, it returns me the prompt and it doesn't stay watching the files:

    gabriel@roraima-tv:/var/www/studying/tera-ping-pong$ npm run webpack

    > [email protected] webpack /var/www/studying/tera-ping-pong
    > webpack --config webpack.config.js


    webpack is watching the files…

    Hash: 6e13d56ba7d77331e5c2
    Version: webpack 4.23.1
    Time: 3014ms
    Built at: 11/01/2018 1:39:11 PM
                       Asset       Size  Chunks             Chunk         Names
    dist/app.controller.d.ts  177 bytes          [emitted]  
        dist/app.module.d.ts   35 bytes          [emitted]  
       dist/app.service.d.ts   56 bytes          [emitted]  
              dist/main.d.ts   11 bytes          [emitted]  
          dist/main.hmr.d.ts   11 bytes          [emitted]  
                   server.js     39 KiB    main  [emitted]  main
    Entrypoint main = server.js
    [0] multi webpack/hot/poll?1000 ./src/main.hmr.ts 40 bytes {main}         [built]
    [./node_modules/webpack/hot/log-apply-result.js]         (webpack)/hot/log-apply-result.js 1.27 KiB {main} [built]
    [./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1.11 KiB         {main} [built]
    [./node_modules/webpack/hot/poll.js?1000] (webpack)/hot/poll.js?        1000 1.15 KiB {main} [built]
    [./src/app.controller.ts] 1.44 KiB {main} [built]
    [./src/app.module.ts] 1.03 KiB {main} [built]
    [./src/app.service.ts] 883 bytes {main} [built]
    [./src/main.hmr.ts] 1.07 KiB {main} [built]
    [@nestjs/common] external "@nestjs/common" 42 bytes {main} [built]
    [@nestjs/core] external "@nestjs/core" 42 bytes {main} [built]
    gabriel@roraima-tv:/var/www/studying/tera-ping-pong$

Therefore, whenever I add my *.ts files changes and they aren't being reloaded until the server restarts.

Upvotes: 7

Views: 18931

Answers (5)

Dragos Lupei
Dragos Lupei

Reputation: 612

The documentation for hot reloading in Nest.js has been updated and it is clearly described step by step how to make this work

You can read more here: https://docs.nestjs.com/recipes/hot-reload

Upvotes: 1

Acheme Paul
Acheme Paul

Reputation: 1275

You can run nest in watch mode

nest start --watch

Upvotes: 14

thiere18
thiere18

Reputation: 141

the problem is that you used

npm start

only instead of

npm start:dev

which runs the server in watch mode:

enter image description here

Upvotes: 4

Vinci
Vinci

Reputation: 1286

you can just use this command in the CLI, it comes by default :

npm run start:dev

Upvotes: 20

Ehsan Lotfinia
Ehsan Lotfinia

Reputation: 134

First install the required packages:

npm i --save-dev webpack-node-externals start-server-webpack-plugin

Once the installation is complete, create a webpack-hmr.config.js file in the root directory of your application.

 const webpack = require('webpack');
const nodeExternals = require('webpack-node-externals');
const StartServerPlugin = require('start-server-webpack-plugin');

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

To enable HMR, open the application entry file (main.ts) and add the following webpack-related instructions:

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();

Upvotes: 6

Related Questions