import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import svgLoader from "vite-svg-loader";
import path from 'path';

export default defineConfig({
  plugins: [vue(), svgLoader()],
  publicDir: "public",
  css: {
    postcss: {
      plugins: [
        require('tailwindcss')('./tailwind.config.js'), // Tailwind CSS configuration
        require('autoprefixer'),
        require('postcss-nested')
      ],
    },
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src'), // Map '@' to the 'src' directory
    },
  },
  build: {
    minify: false,
    outDir: 'dist',
    lib: {
      entry: 'src/components/index.js', // Entry file
      name: 'PageBuilder', // Global variable name for UMD
      fileName: (format) => `page-builder.${format}.js`, // Output file name
    },
    rollupOptions: {
      // Externalize dependencies
      external: ['vue'],
      output: {
        globals: {
          vue: 'Vue',
        },
      },
    },
  },
});