Support multiple values of the same key in defaultDirectives
See original GitHub issueHey @JonasKruckenberg,
thanks for the great project! Probably like most people, I want to use this plugin to create a bunch of differently sized images that are later served as an image with a srcset tag. Because I don’t want to specify all of the breakpoints individually for each image, I found out that there’s the defaultDirectives setting in the Vite plugin options. So the idea is to store a variable containing all of the breakpoints, which is then picked up by the Vite config and automatically applied to every imported image.
However, the setting doesn’t seem to support more than one value for each property at a time – I tried passing the string exactly like you would in an import statement (width=3840;2560;1920 etc.), but the plugin only seems to accept the first number it gets. The exact config I used looks like this:
plugins: [
imagetools({
defaultDirectives: { width: imageWidths.join(";"), format: 'webp' },
}),
],
Is there any way to solve this? I also thought about using dynamic import statements, but I never really got them to work properly. I really like your project, but the design decision to make everything a directive you have to spell out for each individual import makes it quite hard to outsource a common configuration.
Your help would be appreciated 😃
Issue Analytics
- State:
- Created 2 years ago
- Comments:7 (6 by maintainers)

Top Related StackOverflow Question
Sooo, I thought this was gonna come up at some point 😉 The way imagetools works is it first parses the url and generates an object from that. It then generates what I call targets, one for each image that is gonna be produced. The issue is that in your case the defaultDirectives get applied after the last step above. That’s why it’s not working. I am however very unhappy with the way the API works right now so I’m doing (yet another sigh) rewrite and I’ll make sure to address this issue too!
Alright, the custom resolveConfig hook got released in
rollup-plugin-imagetools@2.5.0andvite-imagetools@3.9.0respectively. The direct fix for this issue will also be released soon!