Files
payloadcms/scripts/pack-all-to-dest.ts
Alessio Gravili ebd43c7763 feat: pre-compile ui and richtext-lexical with react compiler (#7688)
This noticeably improves performance in the admin panel, for example
when there are multiple richtext editors on one page (& likely
performance in other areas too, though I mainly tested rich text).

The babel plugin currently only optimizes files with a 'use client'
directive at the top - thus we have to make sure to add use client
wherever possible, even if it's imported by a parent client component.

There's one single component that broke when it was compiled using the
React compiler (it stopped being reactive and failed one of our admin
e2e tests):
150808f608
opting out of it completely fixed that issue

Fixes https://github.com/payloadcms/payload/issues/7366
2024-08-19 17:31:36 -04:00

87 lines
2.2 KiB
TypeScript

import type { ExecSyncOptions } from 'child_process'
import type execa from 'execa'
import chalk from 'chalk'
import { exec as execOrig, execSync } from 'child_process'
import fse from 'fs-extra'
import minimist from 'minimist'
import { fileURLToPath } from 'node:url'
import path from 'path'
import util from 'util'
import { getPackageDetails } from './lib/getPackageDetails.js'
const execOpts: ExecSyncOptions = { stdio: 'inherit' }
const execaOpts: execa.Options = { stdio: 'inherit' }
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)
const exec = util.promisify(execOrig)
main().catch((error) => {
console.error(error)
process.exit(1)
})
async function main() {
const all = process.argv.includes('--all')
process.argv = process.argv.filter((arg) => arg !== '--all')
const noBuild = process.argv.includes('--no-build')
process.argv = process.argv.filter((arg) => arg !== '--no-build')
const args = minimist(process.argv.slice(2))
const { dest } = args
if (!dest) throw new Error('--dest is required')
const resolvedDest = path.resolve(dest)
const packageWhitelist = all
? null
: [
'payload',
'ui',
'next',
'db-mongodb',
'drizzle',
'db-sqlite',
'db-postgres',
'richtext-lexical',
'translations',
'plugin-cloud',
'graphql',
]
const packageDetails = await getPackageDetails(packageWhitelist)
// Prebuild all packages
header(`\n🔨 Prebuilding all packages...`)
//await execa('pnpm', ['install'], execaOpts)
const filtered = packageDetails.filter((p): p is Exclude<typeof p, null> => p !== null)
header(`\nOutputting ${filtered.length} packages...
${chalk.white.bold(filtered.map((p) => p.name).join('\n'))}
`)
if (!noBuild) {
execSync('pnpm build:all --output-logs=errors-only', { stdio: 'inherit' })
}
header(`\n 📦 Packing all packages to ${dest}...`)
await Promise.all(
filtered.map(async (p) => {
await exec(`pnpm pack -C ${p.packagePath} --pack-destination ${resolvedDest}`)
}),
)
header(`\n🎉 Done!`)
}
function header(message: string, opts?: { enable?: boolean }) {
console.log(chalk.bold.green(`${message}\n`))
}