@dcodegroup-au/dsg-vue/vite.config.ts

Front-end Vue/Tailwind DSG for UntitledUI.

// # Import: Vite & Libraries
import { defineConfig, UserConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import svgLoader from "vite-svg-loader";
import path from "node:path";
import dts from "vite-plugin-dts";

// # Build/Export: Vite Configuration
export default defineConfig(({ command, mode }) => {
  // # Import Env Variables
  const isProduction = mode === "production";

  // # Return: Configuration
  return {
    server: {
      host: "0.0.0.0",
    },
    build: {
      outDir: "./dist",
      cssCodeSplit: false,
      target: "esnext",
      lib: {
        entry: {
          "dsg-vue": path.resolve(__dirname, "./src/main.ts"),
          editor: path.resolve(__dirname, "./src/editor.ts"),
          table: path.resolve(__dirname, "./src/table.ts"),
          tailwind: path.resolve(__dirname, "./src/tailwind.ts"),
          helpers: path.resolve(__dirname, "./src/utilities/General.ts"),
          "helpers-string": path.resolve(__dirname, "./src/utilities/Strings.ts"),
          "helpers-object": path.resolve(__dirname, "./src/utilities/Objects.ts"),
        },
        name: "dsg-vue",
        formats: ["es", "cjs"],
        fileName: (format, entryName): string => {
          const formatString: string = format === "es" ? "esm.js" : "cjs";
          return entryName !== "dsg-vue" ? `dsg-vue.${entryName}.${formatString}` : `dsg-vue.${formatString}`;
        },
      },
      rollupOptions: {
        external: ["vue"],
        output: {
          globals: {
            vue: "Vue",
          },
          exports: "named",
        },
      },
    },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src"),
        "~": path.resolve(__dirname),
        "~nm": path.resolve(__dirname, "./node_modules"),
        "@components": path.resolve(__dirname, "src/components"),
        "@tailwind": path.resolve(__dirname, "src/tailwind"),
        "@tw": path.resolve(__dirname, "src/tailwind"),
        "@twplugin": path.resolve(__dirname, "src/tailwind/plugins"),
        "@twconfig": path.resolve(__dirname, "src/tailwind/configuration"),
        "@elements": path.resolve(__dirname, "src/components/Elements"),
        "@icons": path.resolve(__dirname, "src/components/Icons"),
        "@footers": path.resolve(__dirname, "src/components/Footers"),
        "@headers": path.resolve(__dirname, "src/components/Headers"),
        "@misc": path.resolve(__dirname, "src/components/Misc"),
        "@navigation": path.resolve(__dirname, "src/components/Navigation"),
        // "vue": "vue/dist/vue.esm-bundler.js",
      },
    },

    publicDir: "public",
    plugins: [
      vue(),
      dts({
        tsconfigPath: "./tsconfig.json",
        exclude: ["**/tests/**/*", "demo/**/*.ts", "demo/**/*.vue", "docs/**/*.ts", "docs/**/*.vue", "node_modules", "dist"],
      }),
      svgLoader(),
    ],
    test: {
      globals: true,
      environment: 'jsdom',
      setupFiles: './tests/setup.ts',
      include: ['tests/**/*.test.ts'],
      coverage: {
        reporter: ['text', 'html'],
      },
    },    
  } satisfies UserConfig;
});