将 require('...') 与变量一起使用与在 webpack 中使用字符串
Posted
技术标签:
【中文标题】将 require(\'...\') 与变量一起使用与在 webpack 中使用字符串【英文标题】:Using require('...') with a variable vs. using a string in webpack将 require('...') 与变量一起使用与在 webpack 中使用字符串 【发布时间】:2016-09-11 12:28:04 【问题描述】:我有一个对我来说没有多大意义的问题。
我正在映射具有“名称”和“href”属性的对象数组。
let appleIcons = _.map(appleIcons, appleIcon =>
appleIcon.href = require(appleIcon.href);
return appleIcon;
);
在循环内部我想要获取图像,但它会抛出错误“.*$:11 Uncaught Error: Cannot find module”。
当我打印 appleIcon.href 的值并尝试将其直接放入 require('') 时,它会起作用。
appleIcons = _.map(appleIcons, appleIcon =>
appleIcon.href = require('./../../mobile-config/apple-icon-57x57.png');
return appleIcon;
);
那么你能解释一下为什么第二个例子有效而第一个例子抛出错误吗?如何在 require('') 中放入变量?
谢谢!
【问题讨论】:
【参考方案1】:由于 Webpack 在构建时运行,当名称是动态变量时,它无法确定要捆绑哪些模块。您可以通过指定路径的一部分来给它提示(例如,如果您知道所有模块都在一个目录中)。
这个答案可以帮助: https://***.com/a/33048000
(也可以通过 Webpack 检查require.context。另一个例子是业力测试,here。)
或者 - 如果您事先知道文件名,最好添加另一个构建步骤以将字符串输出到文件中,这样 Webpack 可以捆绑它们。
【讨论】:
【参考方案2】:添加一个空字符串为我解决了这个问题。所以,下面的代码应该可以工作:
let appleIcons = _.map(appleIcons, appleIcon =>
appleIcon.href = require('' + appleIcon.href);
return appleIcon;
);
【讨论】:
以上是关于将 require('...') 与变量一起使用与在 webpack 中使用字符串的主要内容,如果未能解决你的问题,请参考以下文章
required_once() 中的变量未定义但可与 require() 一起使用,为啥?
将 ES6 模块与 WebPack 一起使用,为啥仍然需要 require
将 node require 与 Electron 和 Webpack 一起使用