Global-sales/vite.config.js

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import WindiCSS from 'vite-plugin-windicss';
import { VitePWA } from 'vite-plugin-pwa';
import packageJson from './package.json';

const buildDatePlugin = () => {
  return {
    transformIndexHtml(html) {
      const dataString = new Date().toISOString();
      return html.replace(/%BUILD_VERSION%/, `${packageJson.version}(${dataString})`);
    },
  };
};
// PWA plugin
const manifestForPlugIn = {
  // strategies: 'generateSW',
  registerType: 'prompt',
  // includeAssests: ['/src/assets/logo-gh.png'],
  // registerType: 'autoUpdate',
  devOptions: {
    enabled: true
  },
  workbox: {
    globPatterns: ['**/*.{json,css,js,html,ico,png,svg,woff2}'],
    maximumFileSizeToCacheInBytes: 3000000,
    clientsClaim: true,
    skipWaiting: true,
    runtimeCaching: [
      {
        urlPattern: /^https:\/\/haina-sale-system\.oss-cn-shenzhen\.aliyuncs\.com\/.*/i,
        handler: 'CacheFirst',
        options: {
          cacheName: 'oss-cn-media',
          expiration: {
            maxEntries: 20,
            maxAgeSeconds: 60 * 60 * 24 * 7 // <== 7 days
          },
          cacheableResponse: {
            statuses: [0, 200]
          }
        }
      },
      {
        urlPattern: /^https:\/\/hiana-crm\.oss-ap-southeast-1\.aliyuncs\.com\/.*/i,
        handler: 'CacheFirst',
        options: {
          cacheName: 'oss-ap-media',
          expiration: {
            maxEntries: 20,
            maxAgeSeconds: 60 * 60 * 24 * 7 // <== 7 days
          },
          cacheableResponse: {
            statuses: [0, 200]
          }
        }
      },
      {
        urlPattern: /^https:\/\/static-legacy\.dingtalk.com\/.*/i,
        handler: 'CacheFirst',
        options: {
          cacheName: 'dingtalk-avatar-media',
          expiration: {
            maxEntries: 50,
            maxAgeSeconds: 60 * 60 * 24 * 7 // <== 7 days
          },
          cacheableResponse: {
            statuses: [0, 200]
          }
        }
      },
    ],
  },
  manifest: {
    name: 'Sales CRM',
    short_name: 'Sales CRM',
    description: 'Haina travel global sales CRM system',
    icons: [
      {
        src: '/favicon.ico',
        sizes: '32x32',
      },
      {
        src: '/s-launchericon-192-192.png',
        sizes: '192x192',
        type: 'image/png',
      },
      {
        src: '/s-launchericon-144-144.png',
        sizes: '144x144',
        type: 'image/png',
      },
      {
        src: '/s-launchericon-512-512.png',
        sizes: '512x512',
        type: 'image/png',
      },
    ],
    theme_color: '#171717',
    background_color: '#ccd5ae',
    display: 'standalone',
    display_override: ['window-controls-overlay'],
    scope: '/',
    start_url: '/',
    orientation: 'portrait',
  },
};
// https://vitejs.dev/config/
export default defineConfig({
  define: {
    __BUILD_DATE__: JSON.stringify(`${new Date().toISOString()}`),
  },
  plugins: [react(), WindiCSS(), buildDatePlugin(), VitePWA(manifestForPlugIn)],
  server: {
    host: '0.0.0.0',
  },
  resolve: {
    alias: {
      '@': '/src',
    },
  },
  build: {
    // outDir: 'distTest',
    emptyOutDir: true,
    sourcemap: true,
    manifest: true,
    chunkSizeWarningLimit: 555,
    // rollupOptions: {
    //   output: {
    //     manualChunks(id) {
    //       if (id.includes('node_modules')) {
    //         return id.toString().split('node_modules/')[1].split('/')[0].toString();
    //       }
    //     },
    //     chunkFileNames: (chunkInfo) => {
    //       const facadeModuleId = chunkInfo.facadeModuleId ? chunkInfo.facadeModuleId.split('/') : [];
    //       return `assets/[name].[hash].js`;
    //     }
    //   }
    // }
  },
  terserOptions: {
    maxWorkers: 4,
  },
});