import {defineConfig, loadEnv} from "vite";
import {resolve, join} from "path";
import vue from "@vitejs/plugin-vue";
import vuetify from "vite-plugin-vuetify";

// const postcssConfig = {
//   plugins: [
//     require('postcss-import')(),
//     require('postcss-simple-vars')(),
//     require('autoprefixer')(),
//   ],
// };

export default defineConfig((mode) => {
  const env = loadEnv(mode, "..", ""),
    SRC_DIR = resolve("./src"),
    OUT_DIR = resolve("./dist")

  return {
    plugins: [
      vue(),
      vuetify()
    ],
    resolve: {
      alias: {
        "@": resolve(SRC_DIR),
        "vue": "vue/dist/vue.esm-bundler.js"
      }
    },
    root: SRC_DIR,
    base: "/static/",
    // css: {
    //   postcss: postcssConfig
    // },
    server: {
      host: "0.0.0.0",
      port: env.DEV_SERVER_PORT,
      origin: `http://${env.DEV_SERVER_HOST}:${env.DEV_SERVER_PORT}`, // hotfix, webfont was loaded from wrong url
      watch: {
        usePolling: true
      }
    },
    build: {
      manifest: "manifest.json",
      emptyOutDir: true,
      outDir: OUT_DIR,
      rollupOptions: {
        input: {
          app: join(SRC_DIR, "entrypoint/app.js"),
          db: join(SRC_DIR, "entrypoint/db.js"),
          style: join(SRC_DIR, "style/main.css.js")
        },
      }
    }
  }
})