search

11ty / eleventy-plugin-vite

A plugin to use Vite with Eleventy
134 stars 10 forks source link

Eleventy Vite Plugin Passthrough Ordering Bug #33

Closed khalidabuhakmeh closed 1 month ago

khalidabuhakmeh commented 1 year ago

I was able to reproduce this twice on two different sites, and I have no clue why it behaves the way it does, but it does. This is a minor annoyance during development but not a showstopper.

When using the eleventy-plugin-vite package, it is important to register the Vite middleware in a particular order so that --serve resolves changed images correctly when using passthrough copy.

I've found that adding the plugin AFTER calling the addPassthroughCopy method results in no updates to the page when running in --serve mode.

When adding the Vite middleware first, then calling your addPassThroughCopy method, images are resolved more consistently and provide a better development time experience.

Why does the ordering matter? 🤷‍

Incorrect ordering below:

/* Incorrect Ordering */
/* Once serve is started, edit the image using an image editor */
eleventyConfig.addPassthroughCopy("posts/**/*.{gif,jpg,png,svg,jpeg}");
eleventyConfig.addPlugin(EleventyVitePlugin);

Correct ordering:

/* Correct Ordering */
eleventyConfig.addPlugin(EleventyVitePlugin);
eleventyConfig.addPassthroughCopy("posts/**/*.{gif,jpg,png,svg,jpeg}");

Reproduction below:

https://github.com/khalidabuhakmeh/image-update-bug

KiwiKilian commented 1 month ago

Thanks for the detailed report and reproduction! But sadly I can't reproduce. I've checked out your repository, ran npm install and npm run dev. The images updates immediately in the browser when editing with Preview and Photoshop on mac. I've tried both orders and can't see any difference.

Are you using Windows or mac? Can you still reproduce the problem?

khalidabuhakmeh commented 1 month ago

The way 11ty processes plugins may have changed recently, so I think its safe to close this. If it happens again, we can reopen the issue or create a new one.

Thanks for looking into this. 🙏