I had a webpack warning in my nextjs dev server saying
Critical dep: the request of a dependency is an expression
This was because I imported some modules using variables, but the warning got away when i used template strings instead.
Original code that caused the warning to appear (using variables):
const filePath = path.join(__dirname, file)
const module = require(filePath)
I understand the reason for this warning: webpack can't statically analyze and so unnecessarily bundles all possible modules. To get rid of the warning I tried using template strings:
const filePath = path.join(__dirname, file)
const module = require(`${filePath}`)
and this made the error go away but I am confused why. Webpack still doesn't know the filePath at build time as it is still dynamic, how does using template literals in place of just variables makes a difference. Won't webpack include the corresponding module in the final bundle and expect it to available at runtime?