Next 15 turbo config migration from webpack
Unanswered
Common Ringed Plover posted this in #help-forum
Common Ringed PloverOP
I am attempting to migrate to Next.js 15 but am encountering difficulties using the
--turbopack
flag. Here is my current configuration. Based on the turbo documentation (https://nextjs.org/docs/app/api-reference/next-config-js/turbo), it’s unclear to me whether a full migration is feasible, as my existing webpack configuration is dynamic and relies on the default configuration received. My understanding is that turbo
only supports static configuration./** @type {import("next").NextConfig} */
const config = {
reactStrictMode: true,
experimental: {
swcPlugins: [["@lingui/swc-plugin", {}]],
},
webpack(config) {
config.resolve.fallback = { fs: false, net: false, tls: false };
config.externals.push("pino-pretty", "lokijs", "encoding", "eccrypto");
config.module.rules.push({
test: /\.po/,
use: ["@lingui/loader"],
});
// grab the default nextjs rule for handling all images
const nextImageLoaderRule = config.module.rules.find(
(/** @type {any} */ rule) => rule.loader === "next-image-loader",
);
config.module.rules = [
// keep all rules except the default nextjs image loader rule
...config.module.rules.filter((/** @type {any} */ rule) => rule !== nextImageLoaderRule),
// re-add the default image loader rule, but exclude svg
{
...nextImageLoaderRule,
exclude: /\.svg$/i,
},
// add a new rule for svg files, excluding svg files that are imported as react components
// e.g. those that have a `?component` query param as suffix
{
...nextImageLoaderRule,
test: /\.svg$/i,
resourceQuery: {
...nextImageLoaderRule.resourceQuery,
not: [
...nextImageLoaderRule.resourceQuery.not,
/component/, // *.svg?component
],
},
},
// add a new rule for svg files that are imported as react components using svgr
// e.g. those that have a `?component` query param as suffix
{
test: /\.svg$/i,
issuer: /\.[jt]sx?$/,
resourceQuery: /component/, // *.svg?component
use: {
loader: "@svgr/webpack",
options: {
svgoConfig: {
plugins: [
{
name: "preset-default",
params: {
overrides: {
removeViewBox: false,
},
},
},
],
},
},
},
},
];
return config;
},
};