error whe setup with serverModuleFormat: 'cjs',

[mogadanez]

Describe the bug

trying setup by instruction, but I have also MUI in my project. due this I have to use:

  // TODO: when mui has esm support, remove this (default is esm)
  // check it https://github.com/mui/material-ui/issues/30671
  serverModuleFormat: 'cjs',

in my remix.config.js

with it I got follow error when start:

/projects/material-ui-remix-ts/build/index.js:69
var import_i18next_fs_backend = __toESM(require("i18next-fs-backend")), import_node_path = require("node:path"), import_server = require("remix-i18next/server");
                                                                                                                               ^
Error [ERR_REQUIRE_ESM]: require() of ES Module /projects/material-ui-remix-ts/node_modules/remix-i18next/build/server.js from /projects/material-ui-remix-ts/build/index.js not supported.
Instead change the require of server.js in /projects/material-ui-remix-ts/build/index.js to a dynamic import() which is available in all CommonJS modules.
  at Object.<anonymous> (/projects/material-ui-remix-ts/build/index.js:69:130)

Another Issue, in i18next.server.ts type is not observed( see screenshot )

Your Example Website or App

https://github.com/mui/material-ui/tree/master/examples/material-ui-remix-ts

Steps to Reproduce the Bug or Issue

1. get MUI remix template
2. add remix-i18next step by step
3. got error

Expected behavior

Expect to MUI and remix-i18next works together

Screenshots or Videos

Platform

• OS: macOS
• Browser: Chrome
• Version: 122

Additional context

No response

[zakariamofaddel]

Having the first issue too with ES module being imported in commonjs. I am trying to add remix-i18next.

The only way I could quickly solve is by adding to my remix-config.js the option serverDependenciesToBundle: "all". But not sure how this impacts the output size.

[sergiodxa]

While remix-i18next itself is ESM only, other packages like i18next-fs-backend may not, you will need to bundle them on the server. Or if you're using CJS you will need to bundle remix-i18next itself.

Related the type issue, most likely you don't have moduleResolution set to Bundler in your tsconfig.json