Critical dependency: the request of a dependency is an expression

[cmw-big]

WARNING in ./node_modules/.pnpm/[email protected]/node_modules/express/lib/view.js 81:13-25 Critical dependency: the request of a dependency is an expression at CommonJsRequireContextDependency.getWarnings (C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected][email protected]\node_modules\webpack\lib\dependencies\ContextDependency.js:102:18) at Compilation.reportDependencyErrorsAndWarnings (C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected][email protected]\node_modules\webpack\lib\Compilation.js:3132:24) at C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected][email protected]\node_modules\webpack\lib\Compilation.js:2729:28 at _next2 (eval at create (C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected]\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1) at eval (eval at create (C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected]\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:42:1) at C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected][email protected]\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:385:11 at C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected]\node_modules\neo-async\async.js:2830:7 at Object.each (C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected]\node_modules\neo-async\async.js:2850:39) at C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected][email protected]\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:361:18 at C:\Users\cmw10\Desktop\codes\react-ssr\node_modules\.pnpm\[email protected]\node_modules\neo-async\async.js:2830:7 @ ./node_modules/.pnpm/[email protected]/node_modules/express/lib/application.js 22:11-28 @ ./node_modules/.pnpm/[email protected]/node_modules/express/lib/express.js 18:12-36 @ ./node_modules/.pnpm/[email protected]/node_modules/express/index.js 11:0-41 @ ./src/server.tsx 3:0-30 8:12-19 @ ./src/index.ts 1:0-18

[krzysdz]

Template engine support in Express requires dynamic module resolution, which doesn't play nicely with Webpack.

https://github.com/expressjs/express/blob/d854c43ea177d1faeea56189249fff8c24a764bd/lib/view.js#L80-L81

You can find more details about your problem and possible solutions in webpack/webpack#1576. Probably https://github.com/webpack/webpack/issues/1576#issuecomment-766796672 is what you're looking for.

[PathToLife]

I've linked a discussion on webpack side of things.

It seems the code in question is dynamically importing a template-engine for purposes of rendering templates https://expressjs.com/en/guide/using-template-engines.html

A template engine example is: https://expressjs.com/en/resources/template-engines.html

If we really want to bundle express in webpack output, then we can ignore this warning...

There's only two things to consider:

1. Making sure template-engine library is bundled or installed with build code, we can perhaps just make sure project code imports the library somewhere
2. Making sure webpack output e.g main.js is still able to require('template-engine')
3. Making sure rendering is functional.