There is no way to disable/filter preload

[xhebox]

Clear and concise description of the problem

Vite now will not only insert preload directives to the HTML file by the build-html plugin, but also preload helpers for all non-HTML entries by the ImportAnalysis plugin.

And sometimes, you really want lazy loading rather than preloading everything, even for the main HTML entry. There should be a method to control the preload directives generation and preload helper insertion.

Suggested solution

A boolean switch in the config file is enough for me. But maybe a hook function will be better.

[cdll]

hoping to have an option to customize auto preload directive too.

[patak-dev]

After #4097, preload is now disabled for library mode.

@xhebox if your issue is solved by this change, please close this issue. If not, could you provide more information about your use case. We discussed adding an option for preload with the team and we would like to avoid adding more configuration at this point regarding this feature.

[xhebox]

After #4097, preload is now disabled for library mode.

@xhebox if your issue is solved by this change, please close this issue. If not, could you provide more information about your use case. We discussed adding an option for preload with the team and we would like to avoid adding more configuration at this point regarding this feature.

In short, I want a complete disable switch for all preload things, at least.

[ygj6]

Can you explain why you need this feature? What problems can it solve?

[xhebox]

I have not use vite now, but I met several use cases:

1. I wanted to control preload by myself to gain a finer control(It is found while experimenting SSR+SSG). So the built-in one will be duplicated.
2. sveltekit suffers from non-working preload, and I would like to disable it completely.

[idleberg]

After #4097, preload is now disabled for library mode.

I think there are several scenarios where you want to control preload independently from library mode. To give an example: I'm importing a web component into a Svelte project. Both are projects built with Vite. The web component is hosted on a different domain than my Svelte project, but all preloads are pointing to the Svelte project and hence result in a 404.

I don't know if there's a combination of options that fixes my use case. When I build the web component in library mode, my chunks won't have hashes in the filename, but I need them for cache-busting. The Svelte app needs the HTML template as an entry point, so that's no option either. A separate option to disable preload would definitely make this easier. I guess that my particular case could also be seen as a bug: my web component is imported from an URL, so the same should be used for the preloads - not a relative path.

[spacedawwwg]

I'm currently having to run a transform on top of the generated HTML to strip out the preload tags. It's not limited to JS either, it's preloading SVG's etc.

I think a config option to simply disable the behaviour would be a welcome addition.

[idleberg]

I'm currently having to run a transform on top of the generated HTML to strip out the preload tags. It's not limited to JS either, it's preloading SVG's etc.

Would love to see your workaround to transform the generated HTML

[Brain2000]

Can you explain why you need this feature? What problems can it solve?

For one, importmaps
Two, GIANT projects
Three, unthought of things

I've created a managed handler to remove the modulepreload entries in index.html dynamically and inject an importmap. Now I'm finding there is yet another preloader.

[diegofer25]

Can you explain why you need this feature? What problems can it solve?

A big one: Giant project!

there is a way to disable it ?

[Brain2000]

I found the prefilter needs to leave the CSS references, because it turns out, the prefilter is the only way they even load.
We now have importmaps working flawlessly with vite on a project with around 750 files and approximately 250,000 lines of code.

Here is the regex replace that I use to remove the JS prefilter, but keep the CSS prefilter:

var vitePreloadRemove = new System.Text.RegularExpressions.Regex(@",\[((?:""assets\/[^""]+"",?)+)\]", options: RegexOptions.Compiled | RegexOptions.Singleline | RegexOptions.Multiline);

var JSData = System.IO.File.ReadAllText(...); //enumerate and read all .js files in dist folder/subfolders
JSData = vitePreloadRemove.Replace(JSData, (m) => {
                                               //remove just js references, leave CSS references
                                               var newFiles = new List<String>();
                                               var files = m.Captures[0].Value.Split(new Char[] {','});
                                               foreach (var file in files)
                                               {
                                                   //get a list of only the CSS files
                                                   if (file.Length > 5 && file[file.Length - 5] == '.' && file[file.Length - 4] == 'c' && file[file.Length - 3] == 's' && file[file.Length - 2] == 's')
                                                   {
                                                       newFiles.Add(file);
                                                   }
                                                }
                                                return ",[" + String.Join(",", newFiles) + "]";
                                            });

System.IO.File.WriteAllText(..., JSData); //rewrite .js files

[patak-dev]

For the folks involved in this issue, would you check if #9938 would cover your needs? Please give us feedback if you test it in your projects.

[lubomirblazekcz]

@patak-dev I was trying the build.modulePreload option to test if would resolve my issue in #9933 and I noticed that it's included in docs https://vitejs.dev/config/build-options.html#build-modulepreload but it's not part of 3.1 yet, maybe it should be hidden until it's released? Got me confused for a second :)

Otherwise it works great, fixed most of my issues in #9933. Only the issue with double js with single js import remained, but I suspect that might not have anything to do with modulePreload.