ldc-boutique-cnc-sable/vite.config.ts

import path from "node:path";
import { fileURLToPath } from "node:url";

import basicSsl from "@vitejs/plugin-basic-ssl";
import vue from "@vitejs/plugin-vue";
import autoprefixer from "autoprefixer";
import laravel from "laravel-vite-plugin";
import postcssDiscard from "postcss-discard-comments";
import { defineConfig, loadEnv } from "vite";
import { checker } from "vite-plugin-checker";
import eslint from "vite-plugin-eslint2";
import { viteStaticCopy } from "vite-plugin-static-copy";

const env = loadEnv("r", process.cwd(), "");

const isCI = !!process.env.CI;
const debugMode = ["local", "development"].includes(process.env.NODE_ENV ?? "");
const browserTargets = ["es2019", "edge92", "firefox88", "chrome92", "safari15"];

const __dirname = path.dirname(fileURLToPath(import.meta.url));

export default defineConfig({
  build: {
    chunkSizeWarningLimit: 1500,
    target: browserTargets,
    rollupOptions: {
      output: {
        entryFileNames: `assets/${
          debugMode ? "[name]-" : ""
        }[hash].js`,
        chunkFileNames: `assets/${
          debugMode ? "[name]-" : ""
        }[hash].js`,
        manualChunks(id) {
          if (id.includes("node_modules")) {
            // ! Isole Bootstrap
            if (id.includes("bootstrap")) {
              return "vendor-bootstrap";
            }
            // ! Isole Vue
            if (id.includes("vue")) {
              return "vendor-vue";
            }
            // ! Isole FontAwesome
            if (id.includes("@fortawesome")) {
              return "vendor-fontawesome";
            }
            // ! Isole Leaflet
            if (id.includes("leaflet")) {
              return "vendor-leaflet";
            }

            // ! Isole Ckeditor
            if (id.includes("ckeditor")) {
              return "vendor-ckeditor";
            }

            // ! Le reste des node_modules dans un fichier vendor global
            return "vendor";
          }
        },
        assetFileNames: (chunk) => {
          if (
            Array.isArray(chunk.names) &&
                        (chunk.names.some(name => String(name).endsWith("mail-theme.scss")) ||
                        chunk.names.includes("mail-theme.css"))
          ) {
            return "vendor/mail/html/themes/default.[ext]";
          }
          return `assets/${debugMode ? "[name]-" : ""
          }[hash].[ext]`;
        },
      },
    },
    emptyOutDir: true,
    sourcemap: debugMode ? "inline" : false,
    cssTarget: browserTargets,
  },
  css: {
    preprocessorOptions: {scss: {silenceDeprecations: ["color-functions", "global-builtin", "import", "if-function"]},},
    devSourcemap: debugMode,
    postcss: {
      map: {inline: true,},
      plugins: [
        {
          // Hack pour dégager les code css invalid de cookie notice
          postcssPlugin: "remove-empty-var",
          Declaration(decl) {
            if (decl?.value.includes("var()")) {
              decl.remove();
            }
          }
        },
        postcssDiscard({removeAll: true,}),
        autoprefixer(),
      ],
    },
  },
  plugins: [
    basicSsl(),
    ...(isCI ? [] : [checker({
      vueTsc: { root: ".", tsconfigPath: "tsconfig.json" },
      typescript: { root: ".", tsconfigPath: "tsconfig.json" },
      stylelint: {lintCommand: "stylelint --quiet -c .stylelintrc.json --fix **/resources/**/*.scss",},
    })]),
    laravel({
      input: [
        "resources/sass/bo/bo.scss",
        "resources/ts/bo/bo.ts",
        "resources/sass/fo/fo.scss",
        "resources/ts/fo/fo.ts",
      ],
      refresh: !isCI,
    }),
    viteStaticCopy({
      targets: [
        // Favicons
        {
          src: "resources/favicon/*",
          dest: "..",
          rename: { stripBase: true },
        },
      ],
    }),
    eslint({
      cache: false,
      include: "**/*.ts",
      exclude: ["node_modules", "vendor"],
      lintOnStart: false,
      emitWarning: true,
      emitError: true,
    }),
    vue({
      isProduction: !debugMode,
      exclude: ["node_modules", "vendor"],
    })
  ],
  server: {
    host: env["APP_URL"] ? new URL(env["APP_URL"]).hostname : "",
    port: 4443,
    watch: {usePolling: true,},
  },
  resolve: {
    extensions: ["*", ".js", ".ts", ".vue"],
    alias: [
      {
        find: "vue",
        replacement: "vue/dist/vue.runtime.esm-bundler.js",
      },
      {
        find: "@",
        replacement: "/resources/assets",
      },
      {
        find: "@bo",
        replacement: path.resolve(__dirname, "./resources/ts/bo"),
      },
      {
        find: "@fo",
        replacement: path.resolve(__dirname, "./resources/ts/fo"),
      },
      {
        find: "@modules",
        replacement: path.resolve(__dirname, "./resources/ts/modules"),
      },
      {
        find: "@defs",
        replacement: path.resolve(__dirname, "./resources/ts/types"),
      },
      {
        find: "@utilities",
        replacement: path.resolve(__dirname, "./resources/ts/utilities"),
      },
    ],
  },
});