wp-plugin-init/template/vite.config.js

CLI to scaffold a PHP plugin boilerplate structure

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';

export default defineConfig({
  plugins: [vue()],
  root: 'resources',
  base: '',
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'resources/js'),
    },
  },
  server: {
    port: 5174,
    strictPort: true,
    origin: 'http://localhost:5174', // must match AssetHandler::DEV_SERVER
    cors: true,
  },
  build: {
    // Emit to <plugin>/public; hashed files land in public/assets and the
    // manifest at public/.vite/manifest.json, which the PHP AssetHandler
    // reads to enqueue the correct files (content-hash cache busting).
    outDir: '../public',
    emptyOutDir: true,
    manifest: true,
    rollupOptions: {
      // Leading slash = relative to Vite `root` (resources/).
      input: '/js/bootstrap/app.js',
    },
  },
});