2 routers exists in Next.js, "app" router and "page" router. The "app" router has a bug introduced in Next.js 13.4.14, which is not fixed yet. For the moment we cannot use dynamic routes with "app" router with an SPA. As advised by the Next.js team, we migrated to the "pages" router.
41 lines
1.1 KiB
JavaScript
41 lines
1.1 KiB
JavaScript
/** @type {import('next').NextConfig} */
|
|
const nextConfig = {
|
|
output: 'export',
|
|
images: {
|
|
unoptimized: true,
|
|
},
|
|
compiler: {
|
|
// Enables the styled-components SWC transform
|
|
styledComponents: true,
|
|
},
|
|
webpack(config) {
|
|
// Grab the existing rule that handles SVG imports
|
|
const fileLoaderRule = config.module.rules.find((rule) =>
|
|
rule.test?.test?.('.svg'),
|
|
);
|
|
|
|
config.module.rules.push(
|
|
// Reapply the existing rule, but only for svg imports ending in ?url
|
|
{
|
|
...fileLoaderRule,
|
|
test: /\.svg$/i,
|
|
resourceQuery: /url/, // *.svg?url
|
|
},
|
|
// Convert all other *.svg imports to React components
|
|
{
|
|
test: /\.svg$/i,
|
|
issuer: fileLoaderRule.issuer,
|
|
resourceQuery: { not: [...fileLoaderRule.resourceQuery.not, /url/] }, // exclude if *.svg?url
|
|
use: ['@svgr/webpack'],
|
|
},
|
|
);
|
|
|
|
// Modify the file loader rule to ignore *.svg, since we have it handled now.
|
|
fileLoaderRule.exclude = /\.svg$/i;
|
|
|
|
return config;
|
|
},
|
|
};
|
|
|
|
module.exports = nextConfig;
|