build.js

import * as esbuild from 'esbuild'
import { glsl } from "esbuild-plugin-glsl";
import { createRequire } from "module";
import commandLineArgs from 'command-line-args'
import path from 'path';
import { writeFileSync } from 'fs';
import fs from 'node:fs';
import vuePlugin from 'esbuild-vue/src/index.js';
const require = createRequire(import.meta.url);
const pkg = require("./package.json");

const options = commandLineArgs([
    {name: 'target', type: String},
    {name: 'watch', type: Boolean},
    {name: 'serve', type: Boolean},
    {name: 'host', type: String},
    {name: 'port', type: Number},
    {name: 'analyze', type: Boolean},
])

function conditionalImportPlugin(name, config) {
    return {
        name: 'conditional-import-plugin-'+name,
        /**
         * @param {esbuild.PluginBuild} build 
         */
        setup(build) {
            build.onResolve({ filter: config.filter }, args => {
                if (config.library) {
                    return { path: path.join( import.meta.dirname, 'node_modules', path.dirname(args.path), config.file) };
                } else {
                    return { path: path.join(args.resolveDir, path.dirname(args.path), config.file) };
                }
            });
        }
    };
};
function createJsonPlugin(ext_suffix, namespace) {
    return {
        name: `${namespace}-plugin`,
        setup(build) {
            // Intercept import paths with the specified extension
            build.onResolve({ filter: new RegExp(`${ext_suffix}$`) }, args => ({
                path: path.join(
                    args.resolveDir,
                    args.path
                ),
                namespace: `${namespace}-ns`,
            }))

            // Load paths tagged with the specified namespace and treat them as JSON
            build.onLoad({ filter: /.*/, namespace: `${namespace}-ns` }, async (args) => {
                // Read the content of the file
                const content = await fs.promises.readFile(args.path, 'utf8');

                // Return the content as JSON
                return {
                    contents: content,
                    loader: 'json',
                }
            })
        }
    };
};

const isApp = options.target == 'electron';
const dev_mode = options.watch || options.serve;
const minify = !dev_mode;

/**
 * @type {esbuild.BuildOptions} BuildOptions
 */
const config = {
    entryPoints: ['./js/main.js'],
    define: {
        isApp: isApp.toString(),
        appVersion: `"${pkg.version}"`,
    },
    platform: 'node',
    target: 'es2020',
    format: 'esm',
    bundle: true,
    minify,
    outfile: './dist/bundle.js',
    mainFields: ['module', 'main'],
    logLevel: 'info',
    logOverride: {
        'commonjs-variable-in-esm': 'silent'
    },
    external: [
        'electron',
    ],
    loader: {
        '.bbtheme': 'text',
        '.png': 'dataurl'
    },
    plugins: [
        conditionalImportPlugin(2, {
            filter: /native_apis/,
            file: isApp ? 'native_apis.ts' : 'native_apis_web.ts'
        }),
        conditionalImportPlugin(3, {
            filter: /vue.js/,
            file: dev_mode ? 'vue.js' : 'vue.min.js',
            library: true,
        }),
        conditionalImportPlugin(1, {
            filter: /desktop/,
            file: isApp ? 'desktop.js' : 'web.js'
        }),
        createJsonPlugin('.bbkeymap', 'bbkeymap'),
        vuePlugin(),
        glsl({
            minify
        })
    ],
    sourcemap: true,
}

if (options.watch || options.serve) {
    let ctx = await esbuild.context(config);
    if (isApp) {
        await ctx.watch({});
    } else {
        await ctx.serve({
            servedir: import.meta.dirname,
            host: options.host,
            port: options.port
        });
    }
} else {
    if (options.analyze) config.metafile = true;
    let result = await esbuild.build(config);
    if (options.analyze) {
        writeFileSync('./dist/esbuild-metafile.json', JSON.stringify(result.metafile))
    }
}