Symfony Easadymin 4 and vichUploaderBundle

Question

I have this blog entity

<?php

namespace App\Entity;

use Doctrine\ORM\Mapping as ORM;
use Vich\UploaderBundle\Mapping\Annotation as Vich;
use Symfony\Component\HttpFoundation\File\File;
use App\Repository\BlogRepository;

#[ORM\Entity(repositoryClass: BlogRepository::class)]
#[Vich\Uploadable]
class Blog
{
    #[ORM\Id]
    #[ORM\GeneratedValue]
    #[ORM\Column]
    private ?int $id = null;

    #[ORM\Column(length: 255)]
    private ?string $name = null;

    #[ORM\Column(length: 255)]
    private ?string $content = null;

    /**
     * @Vich\UploadableField(mapping="blog_image", fileNameProperty="imageName")
     */
    protected ?File $imageFile = null;

    #[ORM\Column(type: 'string', length: 255, nullable: true)]
    private ?string $imageName = null;

    #[ORM\Column(type: "datetime", nullable: true)]
    private ?\DateTimeInterface $updatedAt = null;

    public function getId(): ?int
    {
        return $this->id;
    }

    public function getName(): ?string
    {
        return $this->name;
    }

    public function setName(string $name): static
    {
        $this->name = $name;

        return $this;
    }

    public function getContent(): ?string
    {
        return $this->content;
    }

    public function setContent(string $content): static
    {
        $this->content = $content;

        return $this;
    }

    public function setImageFile(?File $imageFile = null): static
    {
        $this->imageFile = $imageFile;

        if ($imageFile) {
            $this->updatedAt = new \DateTimeImmutable();
        }

        return $this;
    }

    public function getImageFile(): ?File
    {
        return $this->imageFile;
    }

    public function setImageName(?string $imageName): void
    {
        $this->imageName = $imageName;
    }

    public function getImageName(): ?string
    {
        return $this->imageName;
    }

    public function getUpdatedAt(): ?\DateTimeInterface
    {
        return $this->updatedAt;
    }

    public function setUpdatedAt(?\DateTimeInterface $updatedAt): void
    {
        $this->updatedAt = $updatedAt;
    }
}

And this is my vich_uploader.yaml

vich_uploader:
    db_driver: orm
    mappings:
        blog_image:
            uri_prefix: /uploads/blogs
            upload_destination: '%kernel.project_dir%/public/uploads/blogs'
            inject_on_load: true
            delete_on_update: true
            delete_on_remove: true

And my BlogCrudController

<?php

namespace App\Controller\Admin;

use App\Entity\Blog;
use EasyCorp\Bundle\EasyAdminBundle\Controller\AbstractCrudController;
use EasyCorp\Bundle\EasyAdminBundle\Field\ImageField;
use EasyCorp\Bundle\EasyAdminBundle\Field\TextField;
use Vich\UploaderBundle\Form\Type\VichImageType;

class BlogCrudController extends AbstractCrudController
{
    public static function getEntityFqcn(): string
    {
        return Blog::class;
    }

    public function configureFields(string $pageName): iterable
    {
        return [
            TextField::new('name'),
            TextField::new('content'),
            ImageField::new('imageFile')
                ->setFormType(VichImageType::class) // Use VichImageType for handling uploads
                ->setBasePath('/uploads/blogs') // Define the base path for displaying images
                ->onlyOnDetail()
                ->onlyOnForms(),
        ];
    }
}

I get the message

The "imageFile" image field must define the directory where the images are uploaded using the setUploadDir() method.

Now I have no clue what is going wrong. Adding setUploadDir() in the crudcontroller doesn't work, since vich doesn't have that option.

How do i fix this...?

Answer 1

Make sure that the upload_destination property points to the correct directory where you want the images to be uploaded. In this case, it should point to the public/uploads/blogs directory in your Symfony project.

After updating the VichUploaderBundle configuration, clear the Symfony cache to ensure that the changes take effect