(vite) Unexpected token export from "react-square-web-payments-sdk" package

[BryceBlankinship]

Here is the full error:

12:33:32 PM [vite] Error when evaluating SSR module virtual:server-entry: failed to import "/app/routes/cart/checkout/index.jsx"
|- /my-remix-app/node_modules/react-square-web-payments-sdk/dist/index.es.js:1
export { Ach } from './components/ach/ach.es.js';
^^^^^^

SyntaxError: Unexpected token 'export'
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1178:20)
    at Module._compile (node:internal/modules/cjs/loader:1220:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

I have "type: module" enabled in my package.json, and have used this package without vite and it works fine. This is how they are exporting the component within the package:
export { Ach, Ach as default }; //# sourceMappingURL=ach.es.js.map

Any ideas?

[nguyenduchuyz190]

same error with @radix-ui/theme

export { Theme, useThemeContext, updateThemeAppearanceClass } from './theme';
^^^^^^

SyntaxError: Unexpected token 'export'
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1153:20)
    at Module._compile (node:internal/modules/cjs/loader:1205:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
    at Module.load (node:internal/modules/cjs/loader:1091:32)
    at Module._load (node:internal/modules/cjs/loader:938:12)
    at cjsLoader (node:internal/modules/esm/translators:284:17)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:234:7)
    at ModuleJob.run (node:internal/modules/esm/module_job:217:25)
    at async ModuleLoader.import (node:internal/modules/esm/loader:316:24)

[nguyenduchuyz190]

import { unstable_vitePlugin as remix } from "@remix-run/dev";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  ssr: {
    noExternal: ["@radix-ui/themes"]
  },
  plugins: [remix(), tsconfigPaths()],
});

no error

[grunklejp]

This does seem to work but dumps a ton of garbage to the console.

[vjanssens]

Suggestion by @nguyenduchuyz190, adding ssr.noExternal and specifying the package name did the trick for me! Quite a tough experience, the error does not in any way lead you to the fact this is an issue with SSR and by simply disabling it resolve the problem.