Allow disabling of copying certain assets

Description

During my transition from Rollup to Vite, I spent a lot of time trying to determine how to disable certain assets from getting copied into the bundle. In the SCSS of one of my components, I reference an image within my static/ folder using url() within the CSS. This causes the static asset handling to copy this image to my target output, which is static/bundle/. However, because my entire static/ folder is accessible, it is redundant to copy a file from a sibling folder, static/images/, and ends up doubling assets.

As a workaround, by setting outDir: "", assetsDir: "static/bundle/" (instead of outDir: "static", assetsDir: "bundle") I’m able to at least fix references so that the site will load normally (since /static/bundle is a valid URL but /bundle is not).

Suggested solution

I propose the addition of an assetsExclude option, which would essentially be the opposite of https://vitejs.dev/config/shared-options.html#assetsinclude. This would allow the user to add certain globs that should be left untouched. This option is highly useful for my use case, as I can confidently say that every file within static/ should not be bundled or transformed.

Alternative

An alternative solution could be to add a ?notransform suffix to URLs, which would allow explicitly setting a specific asset URL to not be transformed. This may be a useful option for filepaths that aren’t easy to glob for, or for one-offs.

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that request the same feature to avoid creating a duplicate.

[queengooborg]

Alright then, I think I’m just going to stick with Rollup – even though the Vue Rollup plugin was officially discontinued, I’ve already run into a number of frustrating cases like this with Vite that I don’t want to pursue migrating to it any longer. Thank you anyways. 👍

[bluwy]

What if I’m not using publicDir and I just don’t want any assets in the /static/ folder to be copied to the build, period?

That’s already the case today as long as you don’t explicitly import it. In the example you gave, url("/static/images/drips_navbar.png"), Vite is able to resolve this path the the actual file, so it will bundle it. It works because path starting with / are relative to your Vite project root.

Instead, you can reference it as url("/images/drips_navbar.png") so Vite can’t resolve it. But you have to manually serve files under /static using a middleware like sirv, injected via a Vite plugin configureServer hook. So that it works when fetched by the browser in dev.

This response is not applicable to the intended use case, as it expects the developer to use the Vite dev server, and does not take the build command into account. Furthermore, I am using a Python-based backend to host my website. (And no, converting the backend to a JavaScript-based system is out of the question.)

Yes I’m suggesting for dev specifically since I have no idea how you are serving files under static if you don’t want Vite to handle that for you. In dev, maybe the Python backend is already serving /static, then you can skip my suggestion. But if not, my suggestion would make dev work. However what comes after build and how it’s getting served depends on your Python backend.