{"library":"nodemon-webpack-plugin","title":"Nodemon Webpack Plugin","description":"Nodemon Webpack Plugin is a utility that seamlessly integrates Nodemon's server-restarting capabilities directly into Webpack's watch mode. It eliminates the need to configure and run Nodemon as a separate process, making the development workflow more efficient for Node.js applications bundled with Webpack. The plugin is designed to watch and restart the Webpack output file (typically a server entry point) only when Webpack is in `--watch` mode. The current stable version is 4.8.2, which was last updated in October 2023. This package differentiates itself by tightly coupling server restarts with Webpack's build lifecycle, ensuring the server always runs the latest compiled code without manual intervention.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install nodemon-webpack-plugin"],"cli":null},"imports":["import NodemonPlugin from 'nodemon-webpack-plugin';","const NodemonPlugin = require('nodemon-webpack-plugin');","import type { NodemonPluginOptions } from 'nodemon-webpack-plugin';","import type { Settings } from 'nodemon';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import path from 'path';\nimport NodemonPlugin from 'nodemon-webpack-plugin';\n\nconst config = {\n  mode: 'development',\n  entry: './src/server.ts',\n  target: 'node',\n  output: {\n    path: path.resolve(__dirname, 'dist'),\n    filename: 'server.js',\n  },\n  resolve: {\n    extensions: ['.ts', '.js'],\n  },\n  module: {\n    rules: [\n      {\n        test: /\\.ts$/,\n        use: 'ts-loader',\n        exclude: /node_modules/,\n      },\n    ],\n  },\n  plugins: [\n    new NodemonPlugin({\n      script: './dist/server.js', // Ensure this matches your output filename\n      watch: path.resolve(__dirname, 'dist'), // Watch the output directory\n      ext: 'ts,js,json', // Extensions to watch\n      env: {\n        NODE_ENV: process.env.NODE_ENV ?? 'development',\n        PORT: process.env.PORT ?? '3000',\n      },\n      delay: '1000', // Delay restart to ensure webpack build completes\n      verbose: true,\n    }),\n  ],\n};\n\nexport default config;\n\n// src/server.ts (example server file)\n/*\n  import express from 'express';\n  \n  const app = express();\n  const port = process.env.PORT ? parseInt(process.env.PORT) : 3000;\n\n  app.get('/', (req, res) => {\n    res.send('Hello from Nodemon Webpack Plugin! (Port: ' + port + ')');\n  });\n\n  app.listen(port, () => {\n    console.log(`Server listening on port ${port}`);\n  });\n\n  console.log('Server started/restarted at', new Date().toLocaleTimeString());\n*/\n\n// To run: \n// 1. npm install --save-dev webpack webpack-cli ts-loader typescript nodemon-webpack-plugin express nodemon\n// 2. Add 'start:dev': 'webpack --watch --config webpack.config.ts' to package.json scripts\n// 3. run 'npm run start:dev'","lang":"typescript","description":"This quickstart demonstrates setting up `nodemon-webpack-plugin` with a TypeScript Express server. It configures Webpack to compile a server-side application and uses the plugin to automatically restart the server whenever changes are detected and Webpack rebuilds, showing both zero-config and custom options for Nodemon.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}