add PWA to web app

This commit is contained in:
Luis Canada
2025-10-07 09:15:41 -04:00
parent f1a75d8e81
commit 2171074217
3 changed files with 1828 additions and 43 deletions
+73
View File
@@ -2,6 +2,7 @@ import react from '@vitejs/plugin-react';
import path from 'path';
import { defineConfig, normalizePath } from 'vite';
import { ViteEjsPlugin } from 'vite-plugin-ejs';
import { VitePWA } from 'vite-plugin-pwa';
export default defineConfig({
base: './',
@@ -10,6 +11,13 @@ export default defineConfig({
outDir: path.resolve(__dirname, './out/web'),
rollupOptions: {
input: {
"32x32": normalizePath(path.resolve(__dirname, './assets/icons/32x32.png')),
"64x64": normalizePath(path.resolve(__dirname, './assets/icons/64x64.png')),
"128x128": normalizePath(path.resolve(__dirname, './assets/icons/128x128.png')),
"256x256": normalizePath(path.resolve(__dirname, './assets/icons/256x256.png')),
"512x512": normalizePath(path.resolve(__dirname, './assets/icons/512x512.png')),
"1024x1024": normalizePath(path.resolve(__dirname, './assets/icons/1024x1024.png')),
"preview_full_screen_player": normalizePath(path.resolve(__dirname, './media/preview_full_screen_player.png')),
favicon: normalizePath(path.resolve(__dirname, './assets/icons/favicon.ico')),
index: normalizePath(path.resolve(__dirname, './src/renderer/index.html')),
},
@@ -39,6 +47,71 @@ export default defineConfig({
root: normalizePath(path.resolve(__dirname, './src/renderer')),
web: true,
}),
VitePWA({
registerType: 'autoUpdate',
scope: "/",
devOptions: {
// The PWA will not be shown during development
enabled: false,
},
workbox: {
maximumFileSizeToCacheInBytes: 1000000 * 5 // 5 MB
},
outDir: path.resolve(__dirname, "./out/web/assets"),
injectRegister: "inline",
manifestFilename: "assets/manifest.webmanifest",
manifest: {
name: 'Feishin',
short_name: 'Feishin',
start_url: '/',
background_color: '#FFDCB5',
theme_color: '#1E003D',
icons: [
{
src: '32x32.png',
sizes: '32x32',
type: 'image/png',
},
{
src: '64x64.png',
sizes: '64x64',
type: 'image/png',
},
{
src: '128x128.png',
sizes: '128x128',
type: 'image/png',
},
{
src: '256x256.png',
sizes: '256x256',
type: 'image/png',
},
{
src: '512x512.png',
sizes: '512x512',
type: 'image/png',
purpose: "any"
},
{
src: '1024x1024.png',
sizes: '1024x1024',
type: 'image/png',
},
],
display: 'standalone',
orientation: 'portrait',
screenshots: [
{
src: 'preview_full_screen_player.png',
sizes: '1440x900',
type: 'image/png',
form_factor: 'wide',
label: 'Full screen player showing music player and lyrics',
},
],
},
}),
],
resolve: {
alias: {