Open userquin opened 1 year ago
To add for the record:
I thought that adding a relative path to the assetName
would be a sufficient workaround to change the output location of the generated files. It indeed worked for majority of them. However, I discovered that when a favicon (favicon.ico
) is generated, it remains in the input image's directory. Hence I see this addition as essential (and, subjectively speaking, a lot cleaner!).
However, I discovered that when a favicon (favicon.ico) is generated, it remains in the input image's directory.
Uhmm, you can provide the favicon names with the relative paths, if using defaults the corresponding names will be plain names. You can override favicons with relative paths:
export const minimalPreset: Preset = {
transparent: {
sizes: [64, 192, 512],
favicons: [[64, '../../../public/favicon.ico']], // <== this one: by default [[64, 'favicon.ico']],
},
maskable: {
sizes: [512],
},
apple: {
sizes: [180],
},
}
Ahh, you're totally right, that's the way to go in this case ;) appreciate your help
if you need the path change for all the generated assets, add an assetName
function to your preset:
import { AssetType, ResolvedAssetSize, defaultAssetName, defineConfig } from '@vite-pwa/assets-generator/config';
export default defineConfig({
preset: {
transparent: {
sizes: [64, 192, 512],
favicons: [[64, 'icons/favicons/favicon.ico']],
},
maskable: {
sizes: [512],
},
apple: {
sizes: [180],
},
assetName: (type: AssetType, size: ResolvedAssetSize) => {
return `icons/favicons/${defaultAssetName(type, size)}`;
},
},
images: ['public/logo.svg'],
});
Hello all, any progress on this?
Regards, Emanuele.
if you need the path change for all the generated assets, add an
assetName
function to your preset:import { AssetType, ResolvedAssetSize, defaultAssetName, defineConfig } from '@vite-pwa/assets-generator/config'; export default defineConfig({ preset: { transparent: { sizes: [64, 192, 512], favicons: [[64, 'icons/favicons/favicon.ico']], }, maskable: { sizes: [512], }, apple: { sizes: [180], }, assetName: (type: AssetType, size: ResolvedAssetSize) => { return `icons/favicons/${defaultAssetName(type, size)}`; }, }, images: ['public/logo.svg'], });
This worked for me. Thanks @benkroeger
se hai bisogno del cambio di percorso per tutte le risorse generate, aggiungi una
assetName
funzione alla tua preimpostazione:import { AssetType, ResolvedAssetSize, defaultAssetName, defineConfig } from '@vite-pwa/assets-generator/config'; export default defineConfig({ preset: { transparent: { sizes: [64, 192, 512], favicons: [[64, 'icons/favicons/favicon.ico']], }, maskable: { sizes: [512], }, apple: { sizes: [180], }, assetName: (type: AssetType, size: ResolvedAssetSize) => { return `icons/favicons/${defaultAssetName(type, size)}`; }, }, images: ['public/logo.svg'], });
This isn't working for me :( When i try to build project i got this error:
error during build:
Error: ENOENT: no such file or directory, open '/workspaces/Saturday/dist/icons/favicons/pwa-64x64.png'
The manifest.webmanifest is created with the correct path for the icons but the assets isn't generated and the dist/icons/favicons/ folder isn't created.
I'm using:
Any suggestion?
By default the pwa assets will be generated in the image source folder, you can use a
assetsName
callback to change the output dir to create the assets in subfolders or in another path (via relative path using..
).Since the pwa assets will use
node path resolve
with the image source folder, we can add a new option (optional) and resolve the asset against the new option or the image folder.Hint:
We need to change the
images
signature to (and the usage from the cli-start module):https://github.com/vite-pwa/assets-generator/blob/main/src/build.ts#L39 will be:
From this comment https://github.com/vite-pwa/assets-generator/pull/13#issuecomment-1693329797