vite.config.js

import ts from '@rollup/plugin-typescript';
import { dirname, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import { defineConfig } from 'vite';
import { injectHtml, minifyHtml } from 'vite-plugin-html';

export default defineConfig(({ command }) => {
  const configDir = dirname(fileURLToPath(import.meta.url));
  const srcDir = resolve(configDir, 'src');
  const pagesDir = resolve(srcDir, 'pages');
  const rev = command === 'build' ? Date.now().toString(32) : '';
  const scriptPath =
    command === 'build'
      ? function (path) {
          return `${this.base}${path}`;
        }
      : function (path) {
          return `${path}`;
        };

  return {
    root: pagesDir,
    base: './',
    plugins: [
      minifyHtml({
        removeAttributeQuotes: false,
        removeEmptyAttributes: false,
      }),
      injectHtml({
        injectData: { rev },
        injectOptions: {
          root: resolve(srcDir, 'template'),
          context: {
            base: null,
            setBase(base) {
              this.base = base;
            },
            scriptPath,
          },
        },
      }),
      {
        ...ts(),
        apply: 'build',
      },
    ],
    esbuild: command !== 'build',
    css: {
      preprocessorOptions: {
        scss: {
          quietDeps: true,
        },
      },
    },
    build: {
      outDir: '../../dist',
      chunkSizeWarningLimit: 1024 * 1024,
      emptyOutDir: true,
      rollupOptions: {
        input: {
          home: resolve(pagesDir, 'index.html'),
          article: resolve(pagesDir, 'article', 'index.html'),
          editor: resolve(pagesDir, 'editor', 'index.html'),
          login: resolve(pagesDir, 'login', 'index.html'),
          profile: resolve(pagesDir, 'profile', 'index.html'),
          register: resolve(pagesDir, 'register', 'index.html'),
          settings: resolve(pagesDir, 'settings', 'index.html'),
        },
      },
      sourcemap: true,
      minify: 'terser',
      terserOptions: {
        ecma: 2019,
        module: true,
        toplevel: true,
        output: {
          ascii_only: true,
          comments: false,
        },
      },
    },
    server: {
      port: 4200,
    },
  };
});