From e88cf1fef73c3c67fd1f5a20ea46eb282d193b78 Mon Sep 17 00:00:00 2001 From: TinaH Date: Tue, 2 May 2023 15:59:28 +0200 Subject: [PATCH] Create build.mjs preparing for esbuild 0.17.x --- bin/build.mjs | 111 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 111 insertions(+) create mode 100644 bin/build.mjs diff --git a/bin/build.mjs b/bin/build.mjs new file mode 100644 index 0000000000..25d9d99547 --- /dev/null +++ b/bin/build.mjs @@ -0,0 +1,111 @@ +import * as esbuild from 'esbuild' +import postcss from 'esbuild-postcss' + +const shouldWatch = process.argv.includes('--watch') + +async function compile(options) { + const ctx = await esbuild.context(options) + if (shouldWatch) { + await ctx.watch() + } else { + await ctx.rebuild() + await ctx.dispose() + } +} + + +const esm = { + define: { + 'process.env.NODE_ENV': shouldWatch ? `'production'` : `'development'`, + }, + bundle: true, + mainFields: ['module', 'main'], + platform: 'neutral', //output format is set to esm, which uses the export syntax introduced with ECMAScript 2015 (i.e. ES6 + sourcemap: shouldWatch, + treeShaking: true, //removes unused code + target: ['es2020'], //or es2015? what should Filament support? + minify: shouldWatch, //includes whitespace, identifiers and syntax + loader: { // convert image urls to embedded images, no need to publish css images + '.jpg': 'dataurl', + '.png': 'dataurl', + '.svg': 'text', + '.gif': 'dataurl', + '.woff': 'file', + '.woff2': 'file', + }, + plugins: [ + postcss(), //remove if you don't import css files in your js, else: create a postcss.config.js file + { + name: 'watchPlugin', + setup(build) { + build.onStart(() => { + console.log('Build starting:' + new Date(Date.now()).toLocaleTimeString()) + }) + build.onEnd(result => { + if (result.errors.length > 0) { + console.log('Build failed:' + new Date(Date.now()).toLocaleTimeString(), result.errors) + } else { + console.log('Build succeeded:' + new Date(Date.now()).toLocaleTimeString()) + } + }) + } + } + ] +} + +const invoked = { + ...esm, + target: ['es2020', 'chrome112', 'edge112', 'firefox113', 'safari16'], //Which browser versions should Filament support? + platform: 'browser', //'wraps the generated JavaScript code in an immediately-invoked function expression to prevent variables from leaking into the global scope +} + +//ESM Modules ------------------------------------------------------------------------------------- + +const formComponents = [ + 'color-picker', + 'date-time-picker', + 'file-upload', + 'key-value', + 'markdown-editor', + 'rich-editor', + 'select', + 'tags-input', + 'text-input', + 'textarea', +] +formComponents.forEach((component) => { + esm.entryPoints = `packages/forms/resources/js/components/${component}.js` + esm.outfile = `packages/forms/dist/components/${component}.js` + compile(esm) +}) + +esm.entryPoints = [`packages/support/resources/js/async-alpine.js`] +esm.outfile = `packages/support/dist/async-alpine.js` +compile(esm) + + +esm.entryPoints = [`packages/widgets/resources/js/components/chart.js`] +esm.outfile = `packages/widgets/dist/components/chart.js` +compile(esm) + +esm.entryPoints = [`packages/widgets/resources/js/components/stats-overview/card/chart.js`] +esm.outfile = `packages/widgets/dist/components/stats-overview/card/chart.js` +compile(esm) + +//-------------------------------------------------------------------------------------------------- + +//window scripts ----------------------------------------------------------------------------------- + +const pkgs = ['app', 'forms', 'notifications', 'support', 'tables'] +//renamed package to pkg, because package is a reserved word in JS +packages.forEach((pkg) => { + invoked.entryPoints = [`packages/${pkg}/resources/js/index.js`] + invoked.outfile = `packages/${pkg}/dist/index.js` + compile(invoked) +}) + +invoked.entryPoints = [`packages/app/resources/js/echo.js`] +invoked.outfile = `packages/app/dist/echo.js` +compile(invoked) + +//--------------------------------------------------------------------------------------------------