unclear how to resolve critical dependencies warning for express/lib/view.js

[cch5ng]

hi, when I run webpack, I get a warning message like:

WARNING in node_modules/express/lib/view.js
Critical dependencies:
78:29-56 the request of a dependency is an expression
@ node_modules/express/lib/view.js 78:29-56

I'm not clear what I should do to resolve this. thanks.

[sokra]

Don't bundle express. You can't spin up a server in the browser.

[3ginger]

@sokra
I have express only in server bundle, but i have the same warnings.
The config target is node.

[dcoj]

@cch5ng I also am seeing this issue, did you ever solve it? I'm targeting node so not sure why I'm getting a warning. I'm using Express 4.13.3.

[cch5ng]

@darrencrossley, sorry, I don't really have a deep understanding of webpack. since I reported this issue, I have been referencing bebraw's book (http://survivejs.com/webpack_react/webpack_and_react/) for basic webpack config (for react, babel). I have not experienced the same issue since but I also have not needed to install express individually.

at the time I reported this, I was also new to using require or import and so there may have been user error involved.

[ufocoder]

There's a dynamical requirement in ExpressJS: https://github.com/expressjs/express/blob/master/lib/view.js#L78

UPD: As I find out webpack output Critical dependencies for non obviously requirement, therefore two ways either make obviously requirement in ExpressJS or disable CriticalDependenciesWarning in webpack, but I think that the last one is not so pretty

[bebraw]

Time to close. If still relevant, please re-open at Stack Overflow.

[mariohmol]

Hi there... for those who get here.. use this module that it fixes all the warning for dependencies in your express app with webpac https://github.com/liady/webpack-node-externals

[psulek]

This little "hack" works for me:

module: {
    noParse: function (content) {
        return /express/.test(content);
    }
}

Basically it "skips" parsing "expressjs".

[stephencranedesign]

@psulek this accomplished the same thing, basically telling webpack not to include express in the generated bundle.

externals: ['express', ... ]

[psulek]

@stephencranedesign yes you're right, that does not help, just tested it right now.

[stephencranedesign]

@psulek - found this module and it did the trick for me: https://github.com/liady/webpack-node-externals

[ashblue]

https://github.com/liady/webpack-node-externals not only fixed my warnings / errors. It also reduced my file size tremendously from 2mb+ to 10kb.

[jorgemmsilva]

You should be aware that using webpack-node-externals will not bundle any of your node modules dependencies.
While this is the desired output for some projects, packaging all your dependencies using webpack tree shaking capabilities onto a single file can be useful.

[azizj1]

What if you need to bundle your node modules? E.g., when creating an AWS lambda, your dependencies that you excluded aren't available on AWS environment, and will thus fail.

Is there a way to resolve this warning without telling webpack to not include express?

[Stanback]

For times where I want to bundle everything together for use on the server, the best I could do was suppress the warning by adding the following to my webpack config:

  stats: {
    warningsFilter: w => w !== 'CriticalDependenciesWarning',
  },

[azizj1]

Even shorter:

config: {
    stats: {
            warningsFilter: /^(?!CriticalDependenciesWarning$)/
    }
}

[mutech]

So far I see two approaches:

• Not bundling node modules - e.g. express - by using webpack-node-externals
• Ignoring the warning

Not bundling externals removes much of the motivation to bundle the express server in first place. If there is little to gain from bundling, that would be ok. The potential I see for bundling the server would be a small gain in startup time and a smaller memory footprint. Am I missing something or would this be a negligible advantage?

About ignoring the warning: So webpack warns that it can't determine what is actually being imported in view.js. What are the consequences? Would that dynamic import fail? If not, is there a risk that the import somehow interferes with bundled code? Would it simply result in potentially duplicated code? Or short: is it really safe to ignore the warning?

I read somewhere else that such warnings have to be resolved via resolve aliases or otherwise. Is that impossible for this specific occurrence?

[jmahc]

Keep returning to this page for the error.

Here is what helped me:

...

externals: [
  { express: 'commonjs express' },
  nodeExternals({
    whitelist: isDevelopment ? ['webpack/hot/poll?1000'] : [],
  })
]

...

[zhaoxuyll]

improvement for bundle any node modules:

  stats: {
    warningsFilter: warning => {
      // Critical dependency
      return RegExp("node_modules/express/lib/view.js").test(warning);
    }
  }

[Lonniebiz]

Improvement for in case you have multiple files to block errors from:

let wp = {}; wp.stats = {}; wp.stats.warningsFilter = (warning)=>
{
	let aryFilesToBlockWarningsFrom =
	[
		"node_modules/express/lib/view.js",
		"node_modules/require_optional/index.js" //https://github.com/christkv/require_optional/issues/10
	];

	let block = false;
	aryFilesToBlockWarningsFrom.forEach((modulePath)=>
	{
		if(RegExp(modulePath).test(warning) === true)
		{
			block = true;
		}
	});
	return block;
};

I have the same issue when I bundle mongodb.

[eternalmatt]

Installing @types/express fixed this for me.

npm install --save-dev @types/express

[colasgabens]

@psulek this accomplished the same thing, basically telling webpack not to include express in the generated bundle.

externals: ['express', ... ]

thanks this one work for me

[MirKml]

Improvement for in case you have multiple files to block errors from:

let wp = {}; wp.stats = {}; wp.stats.warningsFilter = (warning)=>
...

webpack 5 changes configuration for ignoring warnings little bit, this one works for me for disabling express view warning for webpack 5

  ignoreWarnings: [
    {
      module: /node_modules\/express\/lib\/view\.js/,
      message: /the request of a dependency is an expression/,
    },
  ],

[jovialcore]

ignoreWarnings:

Hi..thanks for this. In what file should I paste this as I am having the same issue

[colasgabens]

In the webpack config file

[PathToLife]

About ignoring the warning: So webpack warns that it can't determine what is actually being imported in view.js. What are the consequences?

is it really safe to ignore the warning?

View.js hopefully is just template engine code
"https://expressjs.com/en/guide/using-template-engines.html"

It would make sense as it would be dymically importing an engine package.

https://github.com/expressjs/express/blob/8368dc178af16b91b576c4c1d135f701a0007e5d/lib/application.js#L548

I'm guessing as long as you are not using res.render() in express, then things should be ok.

However, depending on how webpack does things, if the rending library is included already in main project, then perhaps res.render() will work as usual.

^ if you're using express template render functionality, can you please ping below if it works in a one file webpack build?

Linking issue with express repo incase someone there knows
expressjs/express#5005 (comment)

[sushmitg]

@psulek this accomplished the same thing, basically telling webpack not to include express in the generated bundle.

externals: ['express', ... ]

This then complains on the production server - " cannot find module 'express' ".

[evident-development]

Add plugin "webpack-node-externals" to your webpack.config.ts file, usage -> https://www.npmjs.com/package/webpack-node-externals