PWA

Documentation Vite-PWA

Une Progressive Web App (PWA) est une application qui combine le meilleur du web et du mobile (surtout web). Elle s’installe sur l’écran d’accueil, fonctionne hors connexion et offre une expérience fluide proche d’une app native.

Vite offre une mise en place simple rapide grâce à son plugin Vite-plugin-pwa

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { VitePWA } from 'vite-plugin-pwa';

export default defineConfig({
    plugins: [
        react(),
        tailwindCSS()
        VitePWA({
            registerType: 'autoUpdate',
            manifest: {
                name: 'SmartMaker',
                short_name: 'SmartMaker',
                start_url: '/',
                display: 'standalone',
                background_color: '#ffffff',
                theme_color: '#5fbabf',
                icons: [
                    {
                        src: 'images/pwa-64x64.png',
                        sizes: '64x64',
                        type: 'image/png'
                    },
                    {
                        src: 'images/pwa-192x192.png',
                        sizes: '192x192',
                        type: 'image/png'
                    },
                    {
                        src: 'images/pwa-512x512.png',
                        sizes: '512x512',
                        type: 'image/png',
                    },
                ]
            }
        })
    ]
});