ldc-legaulois/vite.config.ts

import purge from "@erbelion/vite-plugin-laravel-purgecss";
import basicSsl from "@vitejs/plugin-basic-ssl";
import vue from "@vitejs/plugin-vue";
import autoprefixer from "autoprefixer";
import laravel from "laravel-vite-plugin";
import path from "node:path";
import { fileURLToPath } from "node:url";
import postcssDiscard from "postcss-discard-comments";
import { ConfigEnv, UserConfig, defineConfig, loadEnv } from "vite";
import checker from "vite-plugin-checker";
import { viteStaticCopy } from "vite-plugin-static-copy";
import { sassSafelist } from "./resources/ts/utilities/sass-safelist";

const __dirname = path.dirname(fileURLToPath(import.meta.url));
const env = loadEnv("r", process.cwd(), "");

const purgePlugin = purge({
    templates: ["blade"],
    paths: ["resources/{js,ts,views}/**/*.{ts,js,vue,blade.php}"],
    safelist: sassSafelist,
});

const debugMode = ["local", "development"].includes(process.env.NODE_ENV || "");

// eslint-disable-next-line @typescript-eslint/no-unused-vars
purgePlugin.apply = (config: UserConfig, env: ConfigEnv) => !debugMode;

export default defineConfig({
    build: {
        rollupOptions: {
            output: {
                entryFileNames: `assets/${debugMode ? "[name]-" : ""}[hash].js`,
                chunkFileNames: `assets/${debugMode ? "[name]-" : ""}[hash].js`,
                assetFileNames: (chunk) => {
                    if (
                        String(chunk.name).endsWith("mail-theme.scss") ||
                        chunk.name === "mail-theme.css"
                    ) {
                        return "vendor/mail/html/themes/default.[ext]";
                    }

                    // * Get original file path name
                    const originalFile = chunk.originalFileNames?.[0] ?? "";

                    // ? assets comes from mail ?
                    if (originalFile.includes("assets/images/mail/")) {
                        // * Keep relative original filepath name (ex: mail/socials/facebook.png)
                        const relativePath = originalFile.split("assets/images/mail/")[1];
                        const dir = path.dirname(relativePath);
                        const subDir = dir === "." ? "" : `${dir}/`;

                        return `assets/images/mail/${subDir}[name].[ext]`;
                    }

                    return `assets/${debugMode ? "[name]-" : ""}[hash].[ext]`;
                },
            },
        },
        emptyOutDir: true,
        sourcemap: debugMode ? "inline" : false,
    },
    css: {
        preprocessorOptions: {
            scss: {
                api: "modern-compiler",
                quietDeps: true,
            },
        },
        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(),
        checker({
            enableBuild: false, // Évite de bloquer la compilation prod
            vueTsc: {
                root: ".",
                tsconfigPath: "tsconfig.json",
            },
            typescript: {
                root: ".",
                tsconfigPath: "tsconfig.json",
            },
            eslint: {
                lintCommand: "eslint --max-warnings 0 ./resources",
                useFlatConfig: true,
            },
            stylelint: {
                lintCommand: "stylelint --config ./.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",
                "resources/sass/club/mail-theme.scss",
                "resources/sass/club/club.scss",
                "resources/ts/club/club.ts",
            ],
            refresh: true,
        }),
        viteStaticCopy({
            targets: [
                {
                    src: "resources/favicon/*",
                    dest: "",
                },
                {
                    src: "resources/assets/documents/club/conditions_generales_de_vente.pdf",
                    dest: "",
                },
            ],
            silent: true,
        }),
        vue({
            isProduction: !debugMode,
            exclude: ["node_modules", "vendor"],
        }),
        purgePlugin,
    ].filter(Boolean),
    server: {
        host: env["APP_URL"] ? new URL(env["APP_URL"]).hostname : "",
        port: 4443,
        watch: {
            usePolling: true,
        },
    },
    resolve: {
        extensions: [".js", ".ts", ".vue", ".json"],
        alias: [
            {
                find: "vue",
                replacement: "vue/dist/vue.runtime.esm-bundler.js",
            },
            {
                find: "@",
                replacement: path.resolve(__dirname, "./resources/assets"),
            },
            {
                find: "~",
                replacement: path.resolve(__dirname, "./node_modules"),
            },
        ],
    },
});