#!/usr/bin/env bun
import { existsSync } from 'node:fs'
import { mkdir, rm } from 'node:fs/promises'
import path from 'node:path'
import { css as wispCss } from '@wispplace/css'
console.log('🔨 Building main-app frontend...')
// Get the directory where this script is located
const scriptDir = import.meta.dir
const distDir = `${scriptDir}/dist`
const publicDir = `${scriptDir}/public`
// Clean dist directory
if (existsSync(distDir)) {
await rm(distDir, { recursive: true })
}
await mkdir(distDir, { recursive: true })
await mkdir(`${distDir}/editor`, { recursive: true })
// Build the editor React app
const editorResult = await Bun.build({
entrypoints: [`${publicDir}/editor/editor.tsx`],
outdir: `${distDir}/editor`,
target: 'browser',
format: 'esm',
minify: true,
sourcemap: 'none',
splitting: true,
naming: {
entry: '[name].[hash].js',
chunk: '[name].[hash].js',
asset: '[name].[hash][ext]',
},
})
if (!editorResult.success) {
console.error('❌ Editor build failed:')
for (const log of editorResult.logs) {
console.error(log)
}
process.exit(1)
}
// Find the main entry bundle
const editorBundle = editorResult.outputs.find((o) => o.path.includes('editor.') && o.path.endsWith('.js'))
if (!editorBundle) {
console.error('❌ Could not find editor bundle in outputs')
process.exit(1)
}
const editorBundleName = path.basename(editorBundle.path)
// Generate the production HTML
const htmlContent = `
wisp.place
`
await Bun.write(`${distDir}/editor/index.html`, htmlContent)
// Write wisp.css to public directory so it can be served by static plugin
await Bun.write(`${publicDir}/wisp.css`, wispCss)
console.log('✅ Build successful!')
console.log(`📦 Generated ${editorResult.outputs.length + 2} file(s):`)
console.log(`\n Editor:`)
console.log(` - ${distDir}/editor/index.html`)
for (const output of editorResult.outputs) {
console.log(` - ${output.path}`)
}
console.log(`\n CSS:`)
console.log(` - ${publicDir}/wisp.css`)
console.log(` - ${distDir}/wisp.css`)