antfu / esbuild-node-loader

Transpile TypeScript to ESM with Node.js loader.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

esbuild plugin support

talentlessguy opened this issue · comments

commented

Hello,

I'd like to use esbuild-node-loader with Linaria but it requires to use a plugin for esbuild.

Would be cool for this loader to support plugins (if it's possible)

What's the API you'd expect?

commented

I don't know tbh, but I would like to use a linaria plugin from here:

https://github.com/callstack/linaria/blob/master/docs/BUNDLERS_INTEGRATION.md#esbuild

I don't know tbh, but I would like to use a linaria plugin from here:

https://github.com/callstack/linaria/blob/master/docs/BUNDLERS_INTEGRATION.md#esbuild

Maybe there should be an 'esmo.config.js'

It would be awesome! I use esbuild-node-loader for build ava tests, and, surprisingly, esbuild does not have its own config.

I don't think I would have guessed to look at the configuration in the file esmo.config.js when I not use esmo package.
I suggests esbuild-loader.config.json (babel / rollup inspired).
It can be same object that es-build accept in require('esbuild').build function

// esbuild-loader.config.js

import linariaPlugin from '@linaria/esbuild';
import aliasPlugin from 'esbuild-plugin-alias';

export default {
  plugins: [
    aliasPlugin({
      'imported-path': '/home/user/lib/src/resolved-path'
    }),
    linariaPlugin({
      sourceMap: prod
    }),
  ]
}

This will be very helpful if we can reuse svelte ssr plugin here.

Possible implementation: https://github.com/hyrious/esbuild-dev/blob/develop/src/loader.ts 1

I'm hesitant to add this feature now, since it will be really a lot of code to simulate plugin behavior in loaders mode. For example, you cannot just use esbuild.transform to implement the binary loader.

I may never implement this feature in the end, because of my laziness.

Footnotes

  1. my first try https://gist.github.com/hyrious/5546487637ac86ffb0ec14f754f87d15

What's the API you'd expect?

@antfu Perhaps this could tie in with #30 (comment). As the new loader format exports a single load function. Perhaps esbuild-node-loader could export 2 functions, something like:

export function createLoad(esbuildOptions) {
  return (...loadArgs) => {
    // implementation.
  }
}

export const load = createLoad();

meaning you could point to your own custom loader with node --loader ./custom-esbuild-loader.mjs which would look like:

import { createLoad } from 'esbuild-node-loader';

export const load = createLoad({ customOption: true });