What are all the ways to provide transform plugins to Next.js?

[apteryxxyz]

Summary

I am making a little transform tool thing, code in, code out.
I've made plugins for babel, tsc (ts-patch), everything that unplugin supports, though with Next.js webpack/turbo/swc, I'm unsure how to provide the most support for all Next.js consumers.
So what are all the ways [transform] plugins can be provided that I should account for?

Additional information

No response

Example

No response

[SametDulger]

Ways to Provide Transform Plugins in Next.js
SWC Plugins (Next.js Default Compiler)

Since Next.js uses SWC by default for compiling and transforming JS/TS, you can provide custom SWC plugins.

SWC plugins can be added via the next.config.js using the experimental SWC plugin API:

module.exports = {
  experimental: {
    swcPlugins: [
      ["path-to-plugin", { /* plugin options */ }]
    ],
  },
};

This is still experimental and evolving, so plugin ecosystem is limited compared to Babel.

Babel Plugins

Next.js still supports Babel, primarily via .babelrc or babel.config.js.

You can add Babel transform plugins here for JavaScript or TypeScript:

{
  "presets": ["next/babel"],
  "plugins": ["your-babel-plugin"]
}

Babel plugins work alongside SWC for cases where Babel features/plugins are needed.

Webpack Loaders / Plugins

You can extend or customize Next.js’ underlying webpack config via next.config.js's webpack function.

Provide transform functionality via custom webpack loaders or plugins:

module.exports = {
  webpack(config, options) {
    config.module.rules.push({
      test: /\.ext$/,
      use: ['your-loader'],
    });
    config.plugins.push(new YourWebpackPlugin());
    return config;
  },
};

Works for CSS preprocessors, custom file formats, or additional transform steps.

TypeScript Transformers

Using tools like ts-patch or custom TS transformers, you can modify TypeScript compilation transforms.

This is less integrated in Next.js but possible with custom build steps or patches.

Unplugin Framework

A unified plugin system that works across bundlers (webpack, Vite, Rollup, esbuild).

Many Next.js projects use unplugin to create plugins compatible with multiple tools.

You can integrate unplugin-based plugins via webpack or SWC plugin config.

Turbopack Plugins

Turbopack (the new Rust-based bundler) is experimental but supports plugins.

As Turbopack evolves, plugins will be introduced, potentially using a different API.

Recommendations

Use SWC plugins for future-proofing, but keep Babel for compatibility if needed.

Use webpack config for custom loaders or transformations not supported by SWC/Babel.

Consider using unplugin if you want cross-tool plugin support.

Monitor Turbopack development if you want cutting-edge bundler plugins.