Question

我在angular应用程序中使用服务来创建uibModal，如下所示

function modal(modalConfig){
                  var modalInstance = $uibModal.open({
                  animation: true,
                  template: require("../a/b/xyz.html"),
                  controller: modalConfig.controller,
                  size: modalConfig.size,
                  controllerAs: modalConfig.controllerAs,
                  bindToController : true,
                  resolve: modalConfig.resolveObj

                });
            }

请注意该行

 template: require("../a/b/xyz.html"),

我想在这个地方使用一个变量

 template: require(modalConfig.templateUrl),

但当我使用变量代替硬编码值webpack给我

Critical dependencies:
83:22-54 the request of a dependency is an expression

我无法解决此错误。可能的原因是什么？

我已将node-express服务器用于连续webpack版本。我也查看了其他答案，但他们没有解决我的问题。

Answer 1

经过多次打击和试验后找到了解决方案。我做的是这个：

template: require("../../scripts" + modalConfig.templateUrl + ".html")

假设

所有文件来源的根文件夹是scripts
此文件夹与写入函数的文件的相对路径为../../scripts。
../../scripts + modalConfig.templateUrl + ".html"将形成要使用的文件的正确路径。

强制性提示

始终写一些根文件夹的硬编码路径。不要把它变成变量。所以这不会起作用

var context = "../../scripts" ; template: require(context + modalConfig.templateUrl + ".html")

基本路径（在实际路径的一部分中）必须硬编码以进行基本参考，因为它可以帮助webpack创建动态需要可能需要的所有模块的列表。

原因（来自webpack docs），请阅读dynamic requires。

关键依赖关系 - 依赖关系的请求是表达式Webpack

1 个答案: