Custom (build time) plugins for turbopack

[andr3i1010]

Goals

A few examples that could be achieved with this:

• Obfuscating CSS classes at build time
• Modifying bundles at build time

Non-Goals

idk

Background

I have a custom webpack plugin that injects a custom banner at the top of js bundles:

 webpack: (config, { dev, isServer }) => {
    if (!dev && !isServer) {
      class BannerInjectorPlugin {
        apply(compiler: any) {
          compiler.hooks.emit.tapAsync('BannerInjectorPlugin', (compilation: any, callback: any) => {
            Object.keys(compilation.assets).forEach((filename) => {
              if (filename.endsWith('.js')) {
                const asset = compilation.assets[filename];
                const originalSource = asset.source();
                const banner = `/* PolarLearn is Open-Source: https://github.com/polarnl/polarlearn */\n/* Wat zit je hier te doen tho? */\n`;

                compilation.assets[filename] = {
                  source: () => banner + originalSource,
                  size: () => banner.length + originalSource.length
                };
              }
            });
            callback();
          });
        }
      }

      config.plugins.push(new BannerInjectorPlugin());
    }

    return config;
  },

Unfortunately, webpack is slow. I like turbopack way more since it compiles my entire codebase in less that 20 seconds.

Proposal

Define a plugin in next.config.ts, that defines an action, when it happens and what it does, then in turbopack it should pick up the registered plugin, then do something with it. I can't contribute to turbo itself, since i don't know any system level programming/rust at all.