Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Manual <link rel=modulepreload> causes duplication #16269

Closed
7 tasks done
tomayac opened this issue Mar 25, 2024 · 3 comments
Closed
7 tasks done

Manual <link rel=modulepreload> causes duplication #16269

tomayac opened this issue Mar 25, 2024 · 3 comments

Comments

@tomayac
Copy link
Contributor

tomayac commented Mar 25, 2024

Describe the bug

It seems like trying to help vite make sense of a module structure is causing duplication. This is relevant for module workers (see the related #13355), but also in general even for the main script. See the reproduction case and compare the output for rel=preload vs. rel=modulepreload.

Reproduction

https://stackblitz.com/edit/vitejs-vite-ohybcx

Steps to reproduce

Run npm run build.

System Info

System:
    OS: macOS 14.4
    CPU: (8) arm64 Apple M1
    Memory: 73.41 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 21.7.1 - /opt/homebrew/bin/node
    npm: 10.5.0 - /opt/homebrew/bin/npm
    bun: 0.6.6 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 113.1.51.110
    Chrome: 123.0.6312.59
    Chrome Canary: 125.0.6378.0
    Firefox Nightly: 111.0a1
    Safari: 17.4
    Safari Technology Preview: 17.4

Used Package Manager

npm

Logs

No response

Validations

Copy link

stackblitz bot commented Mar 25, 2024

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.

tomayac added a commit to tomayac/delayedgram that referenced this issue Mar 25, 2024
@hi-ogawa
Copy link
Collaborator

I think it's not just duplication, but <link rel="modulepreload" href="/main.js" /> is simply considered as an static asset and the script is not processed. It would be clearer when using typescript like href="/main.ts" https://stackblitz.com/edit/vitejs-vite-u9ok5x?file=dist%2Fassets%2Fmain-zn5ORrD-.ts

I think this is essentially a same issue as #13355 and it's not supported as a current index.html feature. For now, injecting to <head> manually via plugin as suggested in #13355 (comment) looks like a legitimate solution to me.

@tomayac
Copy link
Contributor Author

tomayac commented Mar 26, 2024

Thanks, closing in favor of #13355 then. It's still somewhat surprising to me that vite sees independent resources, even if the files have the exact same URL and are being referenced in the same index.html entry point, but I'm absolutely not an expert there, just a naive (and very thankful and content) user.

@tomayac tomayac closed this as completed Mar 26, 2024
@github-actions github-actions bot locked and limited conversation to collaborators Apr 10, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants