Esbuild should support plugins

[ndcunningham]

• I'd be willing to implement this feature (contributing guide)

Description

Nx plugins primarily get target (build/lint/test) configurations from a json file project.json.
Which works in the majority of scenarios.

However, the esbuild plugins API allows users to provide a setup function which is passed to the build API.
https://esbuild.github.io/plugins/#finding-plugins

As at our current state Nx 15.7.0 we do not fully support this approach.

Motivation

Initially, this came out of an issue: #14823
PR: to remove plugin in favour of doing it as a feature: #14997

Suggested Implementation

The prospective implementation would be similar to what @jaysoo highlighted.

// esbuild.config.ts
export default {
  //...
  plugins: [require('foo-plugin')]
}

Additionally, should you provide configurations through project.json and esbuild.config.ts we would have a priority merging
For example priority would be

1. esbuild.config.ts
2. project.json configuration
3. Nx internal configuration
4. External configuration

Alternate Implementations

Also support .js files

// esbuild.config.js
module.exports = {
  // ...
  plugins: [require('foo-plugin')]
};

[jaysoo]

I think 2-4 are essentially the same case because passing via CLI will override both the Nx and project configurations. And from the executor's POV, it's all treated the same way.

The main prioritization should be Nx > esbuild.config.js.

Here's an example use case:

1. User defines export default { bundle: false } in their esbuild.config.js
2. User runs nx build <app> --bundle=true
3. Nx will run with bundle: true since it is passed in from CLI. Otherwise, there is no way to override esbuild.config.js.

This is the same thing we do for Vite.

One more consideration is how we can make it type-safe. Vite and other tools export an identity function defineConfig that type-checks that the config is matching what's expected.

So we can do:

// esbuild.config.ts
import { defineConfig } from '@nrwl/esbuild';

export default defineConfig({
  plugins: [...]
});

If it's an JS (or user doesn't care about type-checks) they could just do:

module.exports = {
  plugins: [...]
};

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.