Home > Net >  Type 'string' is not assignable to type 'keyof FitEnum | undefined'
Type 'string' is not assignable to type 'keyof FitEnum | undefined'

Time:07-26

I'm trying to write a service for working with images. I use typescript and sharp. I get this error when I pass a string to fit.

Overload 2 of 2, '(options: ResizeOptions): Sharp', gave the following error.     Type 'string | undefined' is not assignable to type 'keyof FitEnum | undefined'.       Type 'string' is not assignable to type 'keyof FitEnum | undefined'

Tell me how it can be fixed.

import sharp          from 'sharp';
import FileUpload     from '../FileServices/file_upload';
import {IImageUpload} from './types';

class ImageUpload extends FileUpload implements IImageUpload{

  constructor(
    readonly file: Express.Multer.File,
    readonly width?:number,
    readonly height?:number,
    readonly fit?:string,
    readonly watermark?:boolean,
  ) {
    super(file);
  }

  public async resize_image(){
    let file_info = await sharp(this.bufferFile).resize({
        width: this.width,
        height: this.height,
        fit: this.fit
      }
    ).toBuffer({ resolveWithObject: true })
    this.bufferFile = file_info.data;
  }
}

use class ImageUpload

  if(req.file){
    let resizeImg = new ImageUpload(uploadFile,Number(req.body.width),Number(req.body.height),req.body.fit)
    await resizeImg.resize_image();
    let data_file = resizeImg.save_file();
    console.log(data_file);
  }

CodePudding user response:

You declared readonly fit?: string and pass it to sharp's resize config which expects keyof FitEnum type not string. You can solve it by:

import sharp, {FitEnum} from 'sharp';

...

  constructor(
    ...
    readonly fit?: keyof FitEnum,
    ...
  ) 

CodePudding user response:

As in the type definition, The fit options need to be one of "contain", "cover", "fill", "inside", "outside"

   interface FitEnum {
        contain: 'contain';
        cover: 'cover';
        fill: 'fill';
        inside: 'inside';
        outside: 'outside';
    }

   interface ResizeOptions {     
        fit?: keyof FitEnum | undefined;
    }

So, you need to do the following

import { FitEnum } from 'sharp'

and then

  constructor(
    // other props
    readonly fit?:keyof FitEnum,
  ) {
    super(file);
  }
  • Related