Skip to main content

Next.js

Next uses SWC by default for versions > 12, but SWC plugin support remains experimental. If you are on, or can upgrade to, the most recent version of Next it's recommended you try the SWC plugin. If you cannot upgrade or run into any problems with the SWC plugin, please use the Babel instructions.

SWC

SWC PLUGIN SUPPORT IS EXPERIMENTAL

Next.js needs to be at least version 13.4.19 to support our SWC plugin.

Create a next.config.js at the top of your app.

// Base plugin config needed by Next.js
const { pluginoptions } = require('@mightymeld/runtime');

const nextConfig = {
experimental: {
swcPlugins: [['@mightymeld/runtime/swc-plugin-mightymeld', pluginoptions()]]
}
};

module.exports = process.env.MIGHTYMELD ? nextConfig : {};

Babel

Because of the way Next.js bundles Babel, first we'll need to add the @babel/types package.

npm install --save-dev @babel/types

Next, create a babel.config.js at the top of your app. Once this file exists, Next.js will use it as the source or truth for Babel, so it needs to define what Next.js needs as well, which is the next/babel preset.

// Base config needed by Next.js
const babel = {
presets: ['next/babel']
};

if (process.env.MIGHTYMELD) {
babel.plugins = ['@mightymeld/runtime/babel-plugin-mightymeld'];
}

module.exports = babel;

If you already have a babel.config.js, see the "Other Frameworks" section for help extending your config file.