Possible problem when chaining plugins that are resolving the paths

[doberkofler]

I'm unable to resolve the path to my scss modules when using the esbuild-style-plugin plugin as a loader for scss and the esbuild-plugin-path-alias plugin to offer support for aliases using the following build script:

const path = require('path');
const esbuild = require('esbuild');
const esbuildStylePlugin = require('esbuild-style-plugin');
const esbuildAliasPlugin = require('esbuild-plugin-path-alias');

const config = {
	entryPoints: ['./src/index.ts'],
	bundle: true,
	platform: 'browser',
	target: 'es2020',
	outdir: './dist',
	logLevel: 'info',
	plugins: [
		esbuildAliasPlugin({
			'@lib/*': path.resolve('./src/lib/'),
		}),
		esbuildStylePlugin(),
	],
};

(async () => await esbuild.build(config))();

• Am I doing something wrong?
• Is this supposed to work and there is a problem in esbuild and/or the plugins

Example:
esbuild-style-plugin.zip

[hyrious]

Chaining plugins is technically possible but hard in esbuild, plugins work in this order:

import "x"
plugin.onResolve("x") => "/path/to/x" (absolute path)
plugin.onLoad("/path/to/x") => "file contents"

If one of the onResolve returned, there's no further resolver being called.

Back to your 2 plugins, the esbuild-plugin-path-alias does nothing but onResolve, then we got some absolute path like "/path/to/src/lib/style.css". However, the esbuild-style-plugin also has onResolve hook that will never be called, which in turn this plugin "not work".

So the advice is, you can re-implement the style plugin without using onResolve, like mine.

[iyinchao]

+1 on this. In my project I need 2 onResolve plugins work together, each resolves a portion of the path.

Sure I can write a all-in-one plugin, but not so good to reuse.

May be we can add a flag like nonFinal: true for the result of onResolve callback, and transfer to next plugin ?