egoist / egoist/tsup

Is there a way to prepend plugins?

Open
#1,085 0 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
11.3k
Forks
275
PR merge metrics
No merged PRs in 30d

Description

Hey!

We are looking into inlining some of our resources at [react-print-pdf](https://github.com/OnedocLabs/react-print-pdf) where we use `tsup` to bundle the resources. However, it seems that we can only append `esbuild` plugins and not prepend. In our case, we want to use https://github.com/claviska/esbuild-plugin-inline-import but it needs to be passed first as the syntax can't be resolved by other plugins.

An example way we would use it is

```javascript
import css from "inline:./index.css"
```

This causes an error as the file path matches the conditions for some of the earlier plugins, which should just be bypassed because of the `inline:` keyword.

We have also tried patching the `esbuild` config manually, using both esbuildOptions and a tsup plugin

```javascript
import { defineConfig } from "tsup";
import { Plugin } from "esbuild";

const plugin: Plugin = {
name: "inline",
setup(build) {
console.log("Setting up inline plugin");
},
};

export default defineConfig({
entry: ["src/index.ts", "src/mdx.ts"],
splitting: false,
sourcemap: true,
clean: true,
format: ["cjs", "esm"],
dts: true,
plugins: [
{
name: "inline",
esbuildOptions(options) {
options.plugins = [plugin, ...(options.plugins as Plugin[])];

console.log(options);
},
},
],
});
```

But it seems that the plugins are being overwritten or not taken into account at a later stage.

What would be a way to deal with that? Thanks!

Contributor guide

Open the contributing guide

Research direction

Start by tracing how the tsup plugin's esbuildOptions and the supplied esbuild plugins are assembled, using the configuration example in the issue as the reproduction case. Verify behavior with the inline:./index.css import and the inline-import plugin; done means a user-supplied plugin can run before existing plugins without being overwritten.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
build-system, tooling
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.