How to see some node_modules changes using webpack-dev server

Question

I am currently experimenting with monorepo architecture.

What I would like to do is in my web package, where I start the webpack dev server. I would like it to look at specific node_modules (symbolic local packages) for changes and run "rebuild".

This way, I can create dependencies separately, and my browser will respond to these changes.

The configuration of my webpack is as follows:

var loaders = require('./../../../build/loaders-default'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var path = require('path'); var webpack = require('webpack'); module.exports = { entry: ['./src/index.ts'], output: { filename: 'build.js', path: path.join(__dirname, 'dist') }, resolve: { extensions: ['.ts', '.js', '.json'] }, resolveLoader: { modules: ['node_modules'] }, devtool: 'inline-source-map', devServer: { proxy: [ { context: ['/api-v1/**', '/api-v2/**'], target: 'https://other-server.example.com', secure: false } ] }, plugins: [ new HtmlWebpackPlugin({ template: './src/index.html', inject: 'body', hash: true }), new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', 'window.jQuery': 'jquery', 'window.jquery': 'jquery' }) ], module:{ loaders: loaders } }; 

Loaders are just common stuff.

Answer 1

You can enter the webpack.config file or the WebpackDevServer parameter, monitor the changes in node_modules (I think that by default webpack looks at the changes in all files)

https://webpack.js.org/configuration/watch/#watchoptions-ignored

in the following example, webpack ignored all changes to the node_modules folder, except for a specific module.

 watchOptions: { ignored: [ /node_modules([\\]+|\/)+(?!\some_npm_module_name)/, /\some_npm_module_name([\\]+|\/)node_modules/ ] } 

ignored[0] = Regex ignore all node_modules that do not start with some_npm_module_name

ignored[1] = Regex ignore all node_modules inside some_npm_module_name

You can also use this link npm related modules do not find their dependencies