- Add index.html as the main entry point for the application. - Create package.json to manage dependencies and scripts for development. - Include favicon.svg for the application icon. - Configure PWA assets generation with pwa-assets.config.js. - Implement counter functionality in counter.js with notification on reaching 5. - Add JavaScript logo SVG for branding. - Set up main.js to render the application and handle user interactions. - Create notification.js to manage browser notifications. - Implement PWA registration and update handling in pwa.js. - Style the application with a new style.css file. - Configure Vite with PWA plugin in vite.config.js for service worker and manifest settings.
35 lines
756 B
JavaScript
35 lines
756 B
JavaScript
import { VitePWA } from 'vite-plugin-pwa';
|
|
import { defineConfig } from 'vite'
|
|
|
|
// https://vitejs.dev/config/
|
|
export default defineConfig({
|
|
plugins: [VitePWA({
|
|
registerType: 'autoUpdate',
|
|
injectRegister: 'script-defer',
|
|
|
|
pwaAssets: {
|
|
disabled: false,
|
|
config: true,
|
|
},
|
|
|
|
manifest: {
|
|
name: 'budget-manager',
|
|
short_name: 'BM',
|
|
description: 'Application for finance management',
|
|
theme_color: '#ffffff',
|
|
},
|
|
|
|
workbox: {
|
|
globPatterns: ['**/*.{js,css,html,svg,png,ico}'],
|
|
cleanupOutdatedCaches: true,
|
|
clientsClaim: true,
|
|
},
|
|
|
|
devOptions: {
|
|
enabled: true,
|
|
// navigateFallback: 'index.html',
|
|
// suppressWarnings: true,
|
|
type: 'classic',
|
|
},
|
|
})],
|
|
}) |