Angular generating file before each build (via ESBuild plugin) triggers a new rebuild on watch...

We are using the "not-so-new" build system for Angular applications (ESBuild) and we need to execute a node script before each Angular build (or rebuild). This script will generate a custom ts file that is imported in some of the apps components.

We would like to avoid redefining all npm tasks involved (serve, build, start, etc.) to prepend node script.js && , and instead integrate the script execution with the build process.

Based on the approved answer to the question "How to execute a script before each angular compilation (esbuild)?" it seems that developing a custom esbuild plugin would be the way to go.

As per our understanding, the default "application" builder does not allow to use ESBuild plugins, so we have loaded custom-esbuild builder and defined a plugin "generateFile" :

import { exec } from 'child_process';

const generateFile = {
name: 'generate-file',
setup(build) {
build.onEnd(() => {
console.log('Launching script scripts/generate-file.js...');

exec('node scripts/generate-file.js', (error, stdout, stderr) => {
if (error) {
console.error('Error:', error.message);
return;
}
if (stderr) {
console.error('Error:', stderr);
}
console.log(stdout);
});
});
},
};

export default [generateFile];


This works just fine and executes generate-file.js node script and generates the corresponding file (lets call it "generated-file.ts").

The issue arises on watch mode. When we change any component:

• ESBuild detects that a file has changed, so it launches the build again.
• the plugin launches the node script generate-file (again).
• generate-file generates the "generated-file.ts" (again)
• ESBuild detects that a file has changed (because generated-file.ts has changed) which triggers a new rebuild
• the plugin launches the node script generate-file (again), which generates the "generated-file.ts" (again) ...

... and so on, entering an infinite loop

Furthermore, it seems that there are no watch options for ESBuild, which would allow us to ignore some files on watch mode.

Is there any way to tell ESBuild to exclude generated-file from watch mode?

Continue reading...