Vite-PWA
I'm using vite-pwa but everytime i enable it in the dev options my nuxt devtools break.
nuxt.config.ts (snippet)
layouts/default.vue
nuxt.config.ts (snippet)
pwa: {
devOptions: {
enabled: true,
},
manifest: {
short_name: "XYZ",
name: "XYZ",
icons: [
// {
// src: "apple-touch-icon.png",
// sizes: "180x180",
// type: "image/png",
// },
{
src: "android-chrome-192x192.png",
sizes: "192x192",
type: "image/png",
},
{
src: "android-chrome-512x512.png",
sizes: "512x512",
type: "image/png",
},
],
start_url: "/",
display: "standalone",
theme_color: "#7C86FF",
background_color: "#171717",
},
},pwa: {
devOptions: {
enabled: true,
},
manifest: {
short_name: "XYZ",
name: "XYZ",
icons: [
// {
// src: "apple-touch-icon.png",
// sizes: "180x180",
// type: "image/png",
// },
{
src: "android-chrome-192x192.png",
sizes: "192x192",
type: "image/png",
},
{
src: "android-chrome-512x512.png",
sizes: "512x512",
type: "image/png",
},
],
start_url: "/",
display: "standalone",
theme_color: "#7C86FF",
background_color: "#171717",
},
},layouts/default.vue
<template>
<!-- MANIFEST -->
<VitePwaManifest />
<!-- END OF MANIFEST -->
<!-- vaul-drawer-wrapper -->
<UContainer class="px-8 py-16 min-h-screen">
<slot />
</UContainer>
</template><template>
<!-- MANIFEST -->
<VitePwaManifest />
<!-- END OF MANIFEST -->
<!-- vaul-drawer-wrapper -->
<UContainer class="px-8 py-16 min-h-screen">
<slot />
</UContainer>
</template>
