import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import { ViteImageOptimizer } from "vite-plugin-image-optimizer";
import inject from "@rollup/plugin-inject";
import path from "path";
import commonjs from "vite-plugin-commonjs";
import UnoCSS from "unocss/vite";
import autoprefixer from 'autoprefixer';

function pathResolve(dir) {
  return path.resolve(process.cwd(), ".", dir);
}
// https://vitejs.dev/config/
export default ({ mode }) =>
  defineConfig({
    base: loadEnv(mode, process.cwd()).VITE_PUBLIC_DIR,
    server: {
      port: 3611,
    },
    plugins: [
      vue(),
      UnoCSS(),
      commonjs(),
      // ViteImageOptimizer({
      //   png: {
      //     quality: 100,
      //   },
      //   jpg: {
      //     quality: 100,
      //   },
      //   webp: {
      //     quality: 80,
      //   },
      // }),
    ],
    optimizeDeps: {
      include: ["fullPage"],
    },
    css: {
      postcss: {
        plugins: [
          autoprefixer()
        ]
      }
    },
    // build: {
    //   commonjsOptions: {
    //     transformMixedEsModules: true,
    //   },
    // },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src"),
        "##": path.resolve(__dirname, "src/assets"),
        "#": path.resolve(__dirname, "public"),
        fullPage: path.resolve(
          __dirname,
          "src/components/fullpage/extensions.js"
        ),
      },
      extensions: [
        ".mjs",
        ".js",
        ".ts",
        ".jsx",
        ".tsx",
        ".json",
        ".vue",
        ".webp",
      ],
    },
  });