reactjs 中的要求是抛出找不到模块

Question

编辑：新手在此提供帮助。

我已经检查了很多类似的问题，其中 none 个是相同的。

React 正在从 express 接收对象数组。循环遍历，获取每个对象图像 link 并将其添加到源中。

这是原代码

  {this.state.currentTemplates.map((items, pos) => {
            return (
              <div className={`template `}>
                <img src={require(`${items.link}1.jpg`)} />
                <p>{items.name}</p>
                <div className="buy">buy</div>
              </div>

如果这样的图片存在，require 会找到它并且它会起作用。

但是如果我向另一个函数发送请求以首先检查图像是否存在，比如 try catch。

 <div className={`template `}>
//sending url to another function. Also I can put the function outside of class and just call without 'this' and it does not make any difference.

                <img src={this.checkUrl(`${items.link}1.jpg`)} />
                <p>{items.name}</p>
                <div className="buy">buy</div>

例如：

 checkUrl(url) {
       console.log(url); // receive right url '../products/templates/a.jpg'
       try {  
 // try will require the right url but module cannot found it and it goes to catch. Now I can also put it in a variable var a= require(url) and it does not make a difference

          require(url);
console.log("it works "); // it never gets to here.
          return url; // this may not work once returned but it does not get to here.
      }catch(e) {
//react jump to catch with "cannot find module '../products/templates/a.jpg'"
         console.log(e);
       }
}

我收到错误：require 找不到模块'../products/templates/1.jpg'

有趣的事情。如果我使用 templates.jsx 文件在组件文件夹中添加产品文件夹。它有效。

这也不是语法错误，我可能在复制问题时打错了字。

回顾：如果我直接从 src jsx 调用 require(url)，它会找到图像。

如果我将 url 传递给另一个函数来执行 try catch。控制台记录正确 url 但 require throw cannot find module.

这是反应限制吗？有解决办法吗？我是不是以错误的方式接近你？

Answer 1

您以错误的方式处理它，必须提供您的图像，而不是要求它作为一个模块。它必须包含在您的静态资产中，或在其他服务器中提供的外部 url。这是常见的模式，请不要将其复杂化。

如果你有一个 public 文件夹，就像

一样把它放在那里

public/images/image1.jpeg

然后在您的代码中，您可以通过以下方式访问它：

<img src="/images/image1.jpeg" />

前提是您提供资产。

希望对您有所帮助！

Answer 2

首先检查文件夹所在的行路径，以检查提供真实或未使用的路径 <img src={${items.link}1.jpg} /> 不需要同样，如果图像是在网络上找到的外部图像，则不会有问题，但如果是内部存储，请检查您的正确路径

reactjs 中的要求是抛出找不到模块

Require in reactjs is throwing cannot find module

require

reactjs