fix(pwa-assets): resolve image always relative to vite.root
#218
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
commit: |
vite.root
There was a problem hiding this comment.
Pull Request Overview
This PR fixes PWA asset image resolution to always use paths relative to vite.root, addressing issues where images couldn't be resolved consistently across different Nuxt configurations and directory structures.
- Introduces a new
NuxtPWAContexttype to centralize configuration and context data - Implements a more robust image resolution strategy that tries multiple directories (rootDir, srcDir, publicDir) in order
- Updates the PWA assets configuration to use relative paths from
srcDirfor consistency with vite-plugin-pwa
Reviewed Changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/context.ts | Adds new NuxtPWAContext interface to centralize PWA configuration context |
| src/utils/pwa-icons.ts | Refactors image resolution logic to try multiple directories and always resolve relative to vite.root |
| src/utils/pwa-icons-types.ts | Updates function signature to use new context parameter |
| src/utils/module.ts | Creates and passes context object instead of individual parameters |
| src/utils/config.ts | Updates function signature to use context parameter |
| playground-assets/nuxt.config.ts | Adds commented configuration options for testing |
| playground-assets/.nuxtrc | Adds TypeScript configuration exclusion |
| package.json | Adds new development scripts for playground-assets |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
The PWA Assets configuration will be loaded twice, from the module to generate the DTS files and then from
vite-plugin-pwato generate the PWA icons, web manifest and releated stuff.This PR changes the logic in the module to resolve the images always from
rootDir,srcDirandpublicDir(in this order). If using inlined configuration at the Nuxt config. file, then, the new logic will also change the configuration to use the relative path fromsrcDirsincevite-plugin-pwawill usevite.rootto resolve the images.This PR forces to use always
vite.rootwhen using Nuxt v3 v4 compat mode or Nuxt v4 (app folder) to resolve pwa images when usingpwa-assets.config.tsat root or inside the app folder, there is no way to resolve this issue since there is no way to change the logic from this integration (not yet, maybe in a future).Nuxt 3:
public/<icon-name>(recommend) or just<icon-name>pwa-assets.config.ts, can only usepublic/<icon-name>Nuxt 3 v4 compat mode or Nuxt v4+:
public/<icon-name>(recomended),../public/<icon-name>or<icon-name>pwa-assets.config.ts(at root) orapp/pwa-assets.config.ts, the image can be relative to the file or the rootDir: can usepublic/<icon-name>(recomended) or../public/<icon-name>app/pwa-assets.config.ts, the image can be relative to the file or the rootDir: can only use../public/<icon-name>Linked Issues
resolves #204
resolves #210
resolves #211
superdeses #207
Additional Context
About WebStorm/IntelliJ and Nuxt 4
Now WebStorm not working with Nuxt 4, auto completion is not working for PWAXXX components in the template, tried also with the new
Vue LS 3.0 Previewwith and wihout these dependencies, no way (also tried with and without dts on nodeReferences, this PR including them when Nuxt 4 detected):https://youtrack.jetbrains.com/issue/WEB-74161/weird-behavior
/cc @danielroe @niklas-wortmann (I'm out of ideas, VSCode working correctly)
Tip
The author of this PR can publish a preview release by commenting
/publishbelow.