Сообщение об ошибке при добавлении изображения в JS React Portfolio

Question

Я пытаюсь добавить изображение в портфолио JS React. Я запускаю его на localhost: 3000, и когда я ввожу свой код, появляется сообщение об ошибке:

Не удалось скомпилировать.

. / Src / components / pages / достижения. js

Модуль не найден: Ошибка: не удается разрешить '../../../static/assets/images/achievements-miles.jpeg' в 'D: \ Desktop \ Claytons-портфолио \ src' \ components \ pages '

У меня есть код:

import React from "react"; 
import achievementPicture from "../../../static/assets/images/achievements-miles.jpeg";

export default function() {
  return (
    <div className="content-page-wrapper">
      <div
        className="left-column"
        style={{
          background: "url(" + achievementPicture + ") no-repeat",
          backgroundSize: "cover",
          backgroundPosition: "center"
        }}
      />

      <div className="right-column">
      Jack R. and Mary Lois Wheatley Endowed Leadership Scholarship
      <br></br>
      The Wheatley Institution
      <br></br>
      Apr 2020
      <br></br>
      <br></br>
      Outstanding Delegation for Representation of the United Arab Emirates in the Joint Defense Council
      <br></br>
      National Council on U.S.-Arab Relations: Model Arab League
      <br></br>
      Feb 2020
      <br></br>
      <br></br>
      Eagle Scout
      <br></br>
      Boy Scouts Of America
      <br></br>
      2012
      </div>
    </div>
  );
}

Answer 1

Я предполагаю, что ваше изображение находится вне папки sr c. Если вы хотите импортировать изображение, вы должны включить его в путь sr c или настроить свой проект так, чтобы он мог указывать за пределы папки sr c. Был похожий вопрос, на который вы можете найти ответы: Ограничение импорта create-response-app за пределами каталога sr c