Webpack – Critical dependency: the request of a dependency is an expression 的解决方案

错误概述

在使用Webpack进行项目构建时，可能会遇到以下错误信息：“Webpack – Critical dependency: the request of a dependency is an expression”。这一错误通常出现在动态导入（dynamic import）语法使用不当时，Webpack无法确定具体的依赖关系。这种情况会影响到代码的打包和加载，导致项目无法正常运行。

常见原因

导致该错误的常见原因包括：
1. 动态导入的参数不明确：在使用import()时，如果传入一个表达式而不是字符串，Webpack就无法解析出需要加载的模块。
2. Webpack配置不当：如未正确设置externals，可能导致某些模块无法被识别。
3. 版本不兼容：某些库的版本更新可能导致Webpack与这些库之间的兼容性问题。

解决方法

方法 1: 确保动态导入的参数为字符串

确保在使用动态导入（import()）时，传入的参数是明确的字符串，而不是变量或表达式。例如，以下代码将导致错误：

const asset = 'config.json';
lazy(async () => await import(asset)); // 不明确的参数

解决方式是将参数转为字符串：
``javascript
const asset = 'config.json';
lazy(async () => await import($