require(variable) 导致错误找不到模块“。”

Posted 2023-02-24

【中文标题】require(variable) 导致错误找不到模块“。”

【英文标题】：require(variable) causes the error Cannot find module "."

【发布时间】：2018-12-24 12:36:23

【问题描述】：

我正在使用 React 和 Node.js，我正在尝试使用存储为 prop 的 src 属性来渲染图像。但是，每当我尝试向require() 提供存储为变量的路径时，它都会给我此错误：找不到模块“。”

所以我想知道为什么 require 不能处理指向路径但可以处理路径本身的变量？比如这会导致上面提到的错误：

<MyComponent imageSrc='./image.jpg'/>
...
<img src=require(this.props.imageSrc)/>

但这将完美地工作：

<img src=require('./image.jpg')/>

【问题讨论】：

console.log(this.props.imageSrc) 的输出是什么？

Require 要求文件是带有 module.exports 的节点文件。图像没有，因为它是 JPG 文件。但是，如果图像在您的公共目录中，则不需要要求图像才能显示它。

你为什么不这样使用它：<MyComponent imageSrc=require("./image.jpg") /> 然后<img src=this.props.imageSrc) /> 正如@RyanZ 解释的那样，实际上你不需要这里的图像。

@devserkan，谢谢。那行得通。

不客气。然后我会将此评论转换为您正在寻找的答案。

【参考方案1】：

正如 cmets 中所解释的那样，实际上您在这里不需要任何图像。您可以在 src 目录中使用相对路径。但是，对于您的情况，这将起作用：

将 prop 传递给组件时使用 require：

<MyComponent imageSrc=require("./image.jpg") />

并在那里使用这个道具：

<img src=this.props.imageSrc />

---

我最近学到的另一种解决方案：

<img src=require( "" + this.props.imageSrc)  />

【讨论】：

你能解释一下为什么添加一个空字符串可以解决这个问题吗？ require(src) 给我造成了这个错误。 require("" + src) 有效。这对我来说毫无意义。

@DaveStein，我知道这很奇怪 :) 它将变量与空字符串连接起来，因此返回一个字符串。这就是 require 所期望的：一个字符串。