Home

Index

How to use the NormalModuleReplacementPlugin function from webpack

Find comprehensive JavaScript webpack.NormalModuleReplacementPlugin code examples handpicked from public code repositorys.

webpack.NormalModuleReplacementPlugin is a plugin in webpack that allows to replace a module with another one.

index.js

41
42
43
44
45
46
47
48
49
50
 *
 * Thanks goes to Yarn's lead maintainer @arcanis for helping me get to this
 * solution.
 */
plugins.push(
  new NormalModuleReplacementPlugin(/^@babel\/runtime(.*)/, (resource) => {
    const path = resource.request.split('@babel/runtime')[1];

    resource.request = require.resolve(`@babel/runtime${path}`);
  })

815

233

webpack.config.export.js

GitHub: ThemeFuse/Brizy

74
75
76
77
78
79
80
81
82
83
  TARGET: JSON.stringify(options.TARGET),
  IS_EDITOR: false,
  IS_PREVIEW: true,
  window: "undefined"
}),
new webpack.NormalModuleReplacementPlugin(
  /visual\/component\/Toolbar/,
  (r) => {
    switch (r.request) {
      case "visual/component/Toolbar/state":

252

How does webpack.NormalModuleReplacementPlugin work?

The webpack.NormalModuleReplacementPlugin allows for the replacement of modules in the dependency graph of webpack with alternate modules, based on a given test condition. When webpack tries to resolve a module that matches the test condition, the plugin replaces the module with the specified replacement module. This can be used to override or modify the behavior of existing modules or to provide alternative implementations of certain modules.

webpack.config.js

GitHub: neophob/wpc-emu

73
74
75
76
77
78
79
80
81
82
        src: path.resolve('../assets/logo.png'),
        sizes: [96, 128, 192, 256, 384, 512],
      },
    ]
  }),
  new webpack.NormalModuleReplacementPlugin(/^node:/, (resource) => {
    resource.request = resource.request.replace(/^node:/, "");
  })
],
optimization: {

app.webpack.config.js

GitHub: Akylas/oss-weather

507
508
509
510
511
512
513
514
515
516
config.plugins.push(new webpack.IgnorePlugin({ resourceRegExp: /^url$/ }));

if (!!production && !timeline) {
    console.log('removing N profiling');
    config.plugins.push(
        new webpack.NormalModuleReplacementPlugin(/profiling$/, (resource) => {
            if (resource.context.match(nativescriptReplace)) {
                resource.request = '~/shims/profile';
            }
        })

+ 14 other calls in file

Ai Example

1
2
3
4
5
6
7
8
9
10
11
const webpack = require("webpack");

module.exports = {
  plugins: [
    new webpack.NormalModuleReplacementPlugin(
      /module-to-replace/,
      "./custom-module"
    ),
  ],
  // ...
};

In the example above, any module path that matches the regular expression /module-to-replace/ will be replaced with the module path './custom-module'.

webpack.mix.js

GitHub: kolyayurev/adminpanel

8
9
10
11
12
13
14
15
16
17
})
 // Настройка webpack
.webpackConfig({
    plugins: [
        new webpack.ContextReplacementPlugin(/moment[\\\/]locale$/, /^\.\/(en|ru)$/),
        new webpack.NormalModuleReplacementPlugin(/element-ui[\/\\]lib[\/\\]locale[\/\\]lang[\/\\]zh-CN/, 'element-ui/lib/locale/lang/ru-RU')
    ]
})
.options({ processCssUrls: false })
.setPublicPath('public')

+ 3 other calls in file

defaultConfig.js

GitHub: dmkaorgs/friendly-octo-fiesta

33
34
35
36
37
38
39
40
41
42
    'Referrer-Policy': 'same-origin'
  }
},
plugins: [
  new webpack.SourceMapDevToolPlugin(sourceMapsConfig),
  new webpack.NormalModuleReplacementPlugin(/^any-promise$/, 'bluebird'),
  // new BundleAnalyzerPlugin(),
  new ImageminPlugin({
    disable: process.env.NODE_ENV !== 'production',
    test: /\.(jpe?g|png|gif|svg)$/i,

webpack.config.js

GitHub: Tencent/vConsole

37
38
39
40
41
42
43
44
45
46
    },
  })
}
if (noCoreJS) {
  const dummyModulePath = Path.resolve(__dirname, './build/dummy.js');
  plugins.push(new Webpack.NormalModuleReplacementPlugin(/^core-js\/.*/, dummyModulePath));
}

return {
  mode: argv.mode,

312

+ 3 other calls in file

main.js

GitHub: RocketChat/Rocket.Chat

59
60
61
62
63
64
65
66
67
68
        use: '@settlin/spacebars-loader',
});

config.plugins.push(
        new webpack.NormalModuleReplacementPlugin(/^meteor/, require.resolve('./mocks/meteor.js')),
        new webpack.NormalModuleReplacementPlugin(/(app)\/*.*\/(server)\/*/, require.resolve('./mocks/empty.ts')),
);

config.mode = 'development';
config.optimization.usedExports = true;

890

+ 3 other calls in file

Other functions in webpack

Sorted by popularity

webpack.ProvidePlugin is the most popular function in webpack (1161 examples)

Other popular packages:

Home

About