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.

Sign up for GitHub

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

Jump to bottom

<head> tag required for the manifest to be correctly injected #782

Open
simensol opened this issue Nov 13, 2024 · 6 comments · May be fixed by #784
Open

<head> tag required for the manifest to be correctly injected #782

simensol opened this issue Nov 13, 2024 · 6 comments · May be fixed by #784

Comments

@simensol
Copy link

I spent several hours debugging why the <link rel="manifest" href="/manifest.webmanifest"> tag wasn't injected into my app by vite-plugin-pwa.

Since I use unjs/unhead to manage all <head> tags, my index.html entry point didn't have a <head> tag:

<!DOCTYPE html>
<html lang="en">
    <body>
        <div id="app"></div>
        <script type="module" src="/src/main.ts"></script>
    </body>
</html>

I realized that for vite-plugin-pwa to inject the manifest, an empty <head> tag is required:

<!DOCTYPE html>
<html lang="en">
    <head>
    </head>
    <body>
        <div id="app"></div>
        <script type="module" src="/src/main.ts"></script>
    </body>
</html>

This should probably be documented somewhere.
@userquin
Copy link
Member

PR welcome 🙏 (use the docs repo)

@simensol
Copy link
Author

Would it be more appropriate to consider this as a bug or to raise a warning instead of just documenting it?

@userquin userquin linked a pull request Nov 13, 2024 that will close this issue
Open
@userquin
Copy link
Member

@simensol can you check using the version from here #784 (comment) ?

@simensol
Copy link
Author

@userquin The warning message works as expected:

PWA WARNING:
</head> and <body> not found in the html, the service worker and web manifest will not be injected.

However, in my case, only the <head> tag was missing, so no error was raised. Could we also raise an error if only the <head> tag is missing?

@userquin
Copy link
Member

userquin commented Nov 18, 2024 •
edited
Loading

The pr just adds the head if missing, I can change the logic to just log the warning, I will try to change the pr tmr and release a patch version (0.21.1)

@simensol
Copy link
Author

I see. I think creating the missing <head> tag is a good solution, as long as the user sees a warning or info message explaining the behavior.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat(html): add head when missing from entry point vite-pwa/vite-plugin-pwa
2 participants
@simensol @userquin