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

// 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()
    ],
    resolve: {
      alias: {
        "@": resolve(SRC_DIR),
        "vue": "vue/dist/vue.esm-bundler.js"
      }
    },
    root: SRC_DIR,
    base: "/static/",
    // css: {
    //   postcss: postcssConfig
    // },
    server: {
      host: env.DEV_SERVER_HOST,
      port: env.DEV_SERVER_PORT
    },
    build: {
      manifest: "manifest.json",
      emptyOutDir: true,
      outDir: OUT_DIR,
      rollupOptions: {
        input: {
          home: join(SRC_DIR, "entrypoint/app.js"),
          style: join(SRC_DIR, "style/main.css.js")
        }
      }
    }
  }
})