esbuild.config.mjs

import process from 'process';
import fs from 'node:fs';
import esbuild from 'esbuild';
import builtins from 'builtin-modules';
import esbuildSvelte from 'esbuild-svelte';
import watPlugin from 'esbuild-plugin-wat';
import sveltePreprocess from 'svelte-preprocess';
import { config } from 'dotenv';
import { sassPlugin } from 'esbuild-sass-plugin';
import { default as pluginVue } from 'esbuild-plugin-vue-next';
import Vue from '@the_tree/esbuild-plugin-vue3';

config();

const renamePlugin = function (dir) {
    return {
        name: 'rename-styles',
        setup(build) {
            build.onEnd(() => {
                // const { outdir, outfile } = build.initialOptions;
                const outcss = dir + '/main.css';
                const fixcss = outcss.replace('main', 'styles');
                if (fs.existsSync(outcss)) {
                    fs.renameSync(outcss, fixcss);
                }
            });
        },
    };
};

const banner = `/*
THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
if you want to view the source, please visit the github repository of this plugin
*/
`;

const prod = process.argv[2] === 'production';
const dir = process.env.OUTDIR ? process.env.OUTDIR : 'dest';

const copyFiles = ['.hotreload', 'manifest.json', 'versions.json'];

if (!fs.existsSync(dir)) {
    fs.mkdirSync(dir);
}
copyFiles.forEach(file => {
    fs.copyFileSync(file, dir + '/' + file);
});

await esbuild
    .build({
        banner: {
            js: banner,
        },
        entryPoints: ['src/main.ts', 'src/bin/order.bin.ts'],
        bundle: true,
        // drop: prod ? ['console', 'debugger'] : [],
        external: [
            'obsidian',
            'electron',
            '@codemirror/autocomplete',
            '@codemirror/collab',
            '@codemirror/commands',
            '@codemirror/language',
            '@codemirror/lint',
            '@codemirror/search',
            '@codemirror/state',
            '@codemirror/view',
            '@lezer/common',
            '@lezer/highlight',
            '@lezer/lr',
            ...builtins,
        ],
        format: 'cjs',
        watch: !prod,
        target: 'es2018',
        logLevel: 'info',
        sourcemap: prod ? false : 'inline',
        treeShaking: true,
        outdir: dir,
        plugins: [
            watPlugin(),
            Vue({ isProd: true, postcss: {} }),
            // pluginVue(),
            esbuildSvelte({
                preprocess: sveltePreprocess(),
            }),
            sassPlugin(),
            renamePlugin(dir),
        ],
    })
    .catch(() => process.exit(1));