为什么我不能从同一个文件夹导入我的组件？

Question

我正在将我的图标导入我的 BtnSlider.js，有什么问题吗，但是有一个错误，如“./src/components/Slider/BtnSlider.js 找不到模块：无法解析 'C:\Users\Admow.png'" 中的 './Icons/left-arrow.png'"

这是我的 BtnSlider：

import React from "react";
import "./Slider.css";
import leftArrow from "./Icons/left-arrow.png";
import rightArrow from "./Icons/right-arrow.jpg";

export default function BtnSlider() {
  return (
    <button className="btn-slide">
      <img src={rightArrow} />{" "}
    </button>
  );
}

这是我的目录：

Answer 1

看起来你的目录结构和你想象的不一样。

您在与图像相同的目录中有一个名为 Icons 的文件。但是您似乎期望 Icons 是一个目录，并且您的图像在其中。

要修复它，您可以创建正确的目录结构，或者将导入更改为：

import leftArrow from "./left-arrow.png";

为什么我不能从同一个文件夹导入我的组件？

Why can't i import my component from the same folder?

directory

import

image

reactjs