JonasKruckenberg / imagetools

Load and transform images using a toolbox :toolbox: of custom import directives!
MIT License
933 stars 59 forks source link

Vite plugin crash #683

Closed AFCMS closed 9 months ago

AFCMS commented 9 months ago

With Vite (react) + vite-imagetools latest versions, I am getting a weird crash when running development server or production build.

vite: 5.0.11
vite-imagetools: 6.2.9
@vitejs/plugin-react: 4.2.1

It happens both in local and in the GitHub CI. I noticed it after updating both to latest.

Here is the configuration I use: https://github.com/AFCMS/AFCMS.github.io/blob/master/vite.config.mts#L55-L57

Here is the GitHub Actions workflow: https://github.com/AFCMS/AFCMS.github.io/actions/runs/7572982697/workflow

And here is the failed GitHub Actions job: https://github.com/AFCMS/AFCMS.github.io/actions/runs/7572982697/job/20624068520#step:5:11

Basically something like this:

image

Disabling the plugin solves the crash.

benmccann commented 9 months ago

This would be from sharp. Please take a look at previously filed issues and see if there's anything there to help: https://github.com/lovell/sharp/issues?q=munmap_chunk+is%3Aissue. If you can't find a solution, please file a new issue at https://github.com/lovell/sharp/issues

AFCMS commented 9 months ago

@benmccann

I didn't manage to reproduce using the latest sharp.

I tried running the following on all my project's PNG files:

import sharp from "sharp"
import * as fs from "fs";

fs.readdirSync(".").forEach(file => {
  if (file.match(/\.png$/)) {
    sharp(`${file}`).resize({width: 100}).webp({quality: 90}).toFile(`${file}.webp`)
  }
})

Its a combination of the parameters I use in my project.

webp format and quality are set at the project level, some images have additional resize to 100px wide.