Issue with Plate.js AI editor on Remix Framework: Unknown file extension error

[tomasconnor]

Hello,

I’ve been trying to install the Plate.js AI editor on a project using the Remix framework, but I'm encountering an issue during compilation. The error is as follows:

Unknown file extension ".css" for /node_modules/katex/dist/katex.min.css

It seems that this error might be related to Remix, which uses Vite, as the same setup works fine with Next.js. Has anyone experienced this issue or knows how to resolve it in Remix? Any help would be greatly appreciated!

Thank you!

[tomasconnor]

Ok, I managed to resolve this issue on my own. The solution was to add the following configuration to my vite.config.ts file:

ssr: {
  noExternal: [
    "@udecode/cmdk",
    "@udecode/cn",
    "@udecode/plate",
    "@udecode/plate-ai",
    "@udecode/plate-alignment",
    "@udecode/plate-autoformat",
    "@udecode/plate-basic-marks",
    "@udecode/plate-block-quote",
    "@udecode/plate-break",
    "@udecode/plate-callout",
    "@udecode/plate-caption",
    "@udecode/plate-code-block",
    "@udecode/plate-combobox",
    "@udecode/plate-comments",
    "@udecode/plate-date",
    "@udecode/plate-dnd",
    "@udecode/plate-docx",
    "@udecode/plate-emoji",
    "@udecode/plate-excalidraw",
    "@udecode/plate-floating",
    "@udecode/plate-font",
    "@udecode/plate-heading",
    "@udecode/plate-highlight",
    "@udecode/plate-horizontal-rule",
    "@udecode/plate-indent",
    "@udecode/plate-indent-list",
    "@udecode/plate-juice",
    "@udecode/plate-kbd",
    "@udecode/plate-layout",
    "@udecode/plate-line-height",
    "@udecode/plate-link",
    "@udecode/plate-markdown",
    "@udecode/plate-math",
    "@udecode/plate-media",
    "@udecode/plate-mention",
    "@udecode/plate-node-id",
    "@udecode/plate-reset-node",
    "@udecode/plate-resizable",
    "@udecode/plate-select",
    "@udecode/plate-selection",
    "@udecode/plate-slash-command",
    "@udecode/plate-suggestion",
    "@udecode/plate-table",
    "@udecode/plate-toggle",
    "@udecode/plate-trailing-block",
  ],
}

This resolved the issue for me, and hopefully, it will help anyone else facing the same problem.

Happy coding! 😊