Webpack error on svg loader

[mosesoak]

Tried following your tutorial in an existing sanity v2 project and the plugin does not compile:

$ sanity start
✔ Checking configuration files...
⠹ Compiling...webpack built ab6f8b3a38557200a820 in 13007ms
✔ Compiling...
Failed to compile.

Error in ./node_modules/sanity-plugin-asset-source-ogimage/node_modules/@sanity/icons/dist/index.js
Module parse failed: Unexpected token (12:4)
You may need an appropriate loader to handle this file type.
|     xmlns: "http://www.w3.org/2000/svg",
|     ref,
|     ...props,
|     children: /* @__PURE__ */jsx("path", {
|       d: "M18.1569 6.84315C21.281 9.96734 21.281 15.0327 18.1569 18.1569C15.0327 21.281 9.96734 21.281 6.84314 18.1569C3.71895 15.0327 3.71895 9.96734 6.84314 6.84315C9.96734 3.71895 15.0327 3.71895 18.1569 6.84315ZM18.1569 6.84315L6.84401 18.156",
 @ ./node_modules/sanity-plugin-asset-source-ogimage/lib/index.js 26:14-38
 @ ./schemas/documents/dailydiff.tsx
 @ ./schemas/index.ts (part:@sanity/base/schema)
 @ ./node_modules/@sanity/default-layout/lib/schemaErrors/SchemaErrorReporter.js
 @ ./node_modules/@sanity/default-layout/lib/defaultLayout/DefaultLayout.js
 @ ./node_modules/@sanity/default-layout/lib/defaultLayout/index.js
 @ ./node_modules/@sanity/default-layout/lib/Root.js (part:@sanity/base/root)
 @ ./node_modules/@sanity/base/lib/components/SanityRoot.js (part:@sanity/base/sanity-root)
 @ ./node_modules/@sanity/server/lib/browser/entry-dev.js
 @ multi ./node_modules/@sanity/server/lib/browser/entry-dev.js

Error in ./node_modules/sanity-plugin-asset-source-ogimage/node_modules/@sanity/ui/dist/index.esm.js
Module parse failed: Unexpected token (1345:8)
You may need an appropriate loader to handle this file type.
|     if (mode === "bleed") {
|       return {
|         ...muted,
|         enabled: {
|           bg: "transparent",
 @ ./node_modules/sanity-plugin-asset-source-ogimage/lib/defaultLayout.js 30:11-32
 @ ./node_modules/sanity-plugin-asset-source-ogimage/lib/index.js
 @ ./schemas/documents/dailydiff.tsx
 @ ./schemas/index.ts (part:@sanity/base/schema)
 @ ./node_modules/@sanity/default-layout/lib/schemaErrors/SchemaErrorReporter.js
 @ ./node_modules/@sanity/default-layout/lib/defaultLayout/DefaultLayout.js
 @ ./node_modules/@sanity/default-layout/lib/defaultLayout/index.js
 @ ./node_modules/@sanity/default-layout/lib/Root.js (part:@sanity/base/root)
 @ ./node_modules/@sanity/base/lib/components/SanityRoot.js (part:@sanity/base/sanity-root)
 @ ./node_modules/@sanity/server/lib/browser/entry-dev.js
 @ multi ./node_modules/@sanity/server/lib/browser/entry-dev.js

[khalilp5]

Hey were you able to solve this issue?

[mosesoak]

No. I moved on to create a custom solution that auto-generates OG images -- came out pretty nicely! You can check it out here: https://medium.com/@mosesoak/fun-cms-feature-auto-generated-og-images-for-social-shares-with-sanity-io-b6cfcb01c9a1