Herd SSL/TLS Vite Config Hack

vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
import fs from 'fs';
import { homedir } from 'os';
import { resolve } from 'path';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/js/app.js', 'resources/js/admin.js'],
            ssr: 'resources/js/ssr.js',
            watch: [
                'app/Modules/**/*.{js,vue}',
            ],
            refresh: true,
            // right now works in app browsers with my hack
            // tried detectTls & valetTls properties
            // both caused problems with firefox
        }),
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                },
            },
        }),
    ],
    resolve: {
        alias: {
            '@': '/resources/js',
            '@module': '/app/Modules',
            Ziggy: '/vendor/tightenco/ziggy/dist/vue.es.js',
        },
    },
    server: compileServerConfig('app.test'),
});

function compileServerConfig(host) {
    let keyPath = resolve(
        homedir() +
            `/Library/Application Support/Herd/config/valet/Certificates/${host}.key`,
    );
    let certificatePath = resolve(
        homedir() +
            `/Library/Application Support/Herd/config/valet/Certificates/${host}.crt`,
    );
    if (!fs.existsSync(keyPath) || !fs.existsSync(certificatePath)) {
        return {};
    }

    return {
        hmr: { host },
        host,
        https: {
            key: fs.readFileSync(keyPath)
            cert: fs.readFileSync(certificatePath)
        },
    };
}