Cannot import svgs using @svgr/webpack
Unanswered
Polar bear posted this in #help-forum
Polar bearOP
[Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.] {
digest: '1564860533'
}next.config.ts:
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
reactStrictMode: false,
experimental: {
turbo: {
rules: {
'*.svg': {
loaders: ['@svgr/webpack'],
as: '*.js',
},
},
},
}
};
export default nextConfig;### In production
I followed the documentation
https://nextjs.org/docs/app/api-reference/config/next-config-js/turbo#webpack-loaders
1 Reply
@Polar bear
[Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.] {
digest: '1564860533'
}
next.config.ts:
ts
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
reactStrictMode: false,
experimental: {
turbo: {
rules: {
'*.svg': {
loaders: ['@svgr/webpack'],
as: '*.js',
},
},
},
}
};
export default nextConfig;
### In production
I followed the documentation
https://nextjs.org/docs/app/api-reference/config/next-config-js/turbo#webpack-loaders
Pont-Audemer Spaniel
Hey, just stumbled across the same issue, where everything was working fine on dev but not on prod. I forgot that
Writing a config for webpack in
turbopack is only used for dev currently. Writing a config for webpack in
next.config solved the issue for me