// View your website at your own local server
// for example http://vite-php-setup.test

// http://localhost:5133 is serving Vite on development
// but accessing it directly will be empty
// TIP: consider changing the port for each project, see below

// IMPORTANT image urls in CSS works fine
// BUT you need to create a symlink on dev server to map this folder during dev:
// ln -s {path_to_project_source}/src/assets {path_to_public_html}/assets
// on production everything will work just fine
// (this happens because our Vite code is outside the server public access,
// if it where, we could use https://vitejs.dev/config/server-options.html#server-origin)

import { defineConfig, splitVendorChunkPlugin } from 'vite'
import liveReload from 'vite-plugin-live-reload'
import path from 'path'
import { svelte } from '@sveltejs/vite-plugin-svelte'
import svelteConfig from './svelte.config.js' // Configuration Svelte

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    liveReload([
      // edit live reload paths according to your source code
      __dirname + '/../modules/**/*.php',
      __dirname + '/../config/*.php',
      __dirname + '/../web/*.php',
    ]),
    splitVendorChunkPlugin(),
    svelte(svelteConfig),
  ],
  root: 'src',
  base: process.env.APP_ENV === 'development'
    ? '/dev/'
    : '/',

  build: {
    // Output dir for production build
    outDir: '../../web',
    emptyOutDir: false,

    // Emit manifest so PHP can find the hashed files
    manifest: true,

    // Our entry
    rollupOptions: {
      input: path.resolve(__dirname, 'src/main.js'),
    }
  },

  resolve: {
    alias: {
      '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
      '~highlightjs': path.resolve(__dirname, 'node_modules/highlight.js'),
    }
  },

  server: {
    // we need a strict port to match on PHP side
    // change freely, but update on PHP to match the same port
    strictPort: true,
    port: 5133
  },
})