Не удается разрешить изображение в массиве в React JS

Я пытаюсь импортировать изображения в массив в React JS. Мое намерение состоит в том, чтобы иметь возможность отображать массив и отображать изображения по одному за раз. Однако мои изображения не разрешаются должным образом. Я совершенно уверен, что это моя синтаксическая ошибка, но я просто не могу ее решить. В настоящее время я студент, который только учится реагировать, поэтому я очень признателен за любую и любую помощь!

import universe from "./images/universespider.jpeg"

let content = [
    {
        title: "Universe",
        image: universe,
        author: "Alex",
        date: "09/09/8099",
        blog: "Spider-Man is in different universes.",
    },
]

import "./blogs.css"
import content from "../../content"

export default function blogs() {
    return (
        content.map((blog, i) => (

        <div key={i}> 
        <div className="blogBox">
            {blog.title}
            {blog.image}
            {blog.author}
            {blog.date}
            {blog.blog}
            </div>
        </div>
        )
    ))
}

сообщение об ошибке