// @ts-check
import { defineConfig } from "@rsbuild/core";
import { pluginVue } from "@rsbuild/plugin-vue";
import { pluginSass } from "@rsbuild/plugin-sass";

import AutoImport from "unplugin-auto-import/rspack";
import Components from "unplugin-vue-components/rspack";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import { pluginCheckSyntax } from "@rsbuild/plugin-check-syntax";
import { pluginBabel } from "@rsbuild/plugin-babel";
import { pluginVueJsx } from "@rsbuild/plugin-vue-jsx";

import IconsResolver from "unplugin-icons/resolver";
import Icons from "unplugin-icons/rspack";

export default defineConfig({
  plugins: [
    pluginBabel({
      include: /\.[jt]sx?$/,
    }),
    pluginVue(),
    pluginVueJsx(),
    pluginSass(),
    pluginCheckSyntax({
      ecmaVersion: 2015,
    }),
  ],
  tools: {
    rspack: {
      plugins: [
        Icons({
          compiler: "vue3",
          autoInstall: true,
        }),

        AutoImport({
          imports: ["vue", "vue-router"],
          resolvers: [ElementPlusResolver()],
        }),

        Components({
          dirs: ['src/components'],
          dts: true,
          deep: true,
          resolvers: [ElementPlusResolver(), IconsResolver()],
        }),
      ],
    },
  },
  source: {
    include: [{ not: /[\\/]core-js[\\/]/ }],
    entry: {
      index: "./src/main.js",
    },
    tsconfigPath: "./jsconfig.json",
  },
  output: {
    polyfill: "usage",
  },
  html: {
    template: "./index.html",
    mountId: "app",
    meta: {
      viewport: false,
    },
    favicon: "./public/logo.png",
    title: process.env.PUBLIC_APP_NAME,
  },
  server: {
    base: process.env.PUBLIC_SERVER_PATH || "/",
    port: Number(process.env.PUBLIC_SERVER_PORT) || 3000,
  },
});