Webpack plugin for friendly name modules (path instead of number)

During a hot update on the webpack development server on the console, I see the following messages:

[HMR] Updated modules: 
[HMR]  - 1009 
[HMR]  - 1007

I would prefer to see the path names there, and I remember that there was a plugin for this, but he could not find it on Google.

+5
source share
1 answer

UPDATED RESPONSE:

In webpack 4, it is just turned on by default when set to development

module.exports = {
  mode: 'development',
}

and can also be controlled directly:

module.exports = {
  //...
  optimization: {
    namedModules: true
  }
};

ORIGINAL RESPONSE: (for older versions of webpack)

I found it myself, this is part of myself, it webpackseems. this is how you add this:

plugins: [
    new webpack.NamedModulesPlugin(),
    ...
]

Now the names of the modules in the console and in the source will be like this:

[HMR] Updated modules:
[HMR]  - ./../MyModule1.jsx
[HMR]  - ./../MyModule2.jsx
+17
source

Source: https://habr.com/ru/post/1662240/


All Articles