Error loading component from server side

[mweel1]

TypeError: Unknown file extension ".tsx" for /Users/martyweel/repos/mono3/packages/ui/index.tsx
at new NodeError (node:internal/errors:406:5)
at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:99:9)
at defaultGetFormat (node:internal/modules/esm/get_format:142:36)
at defaultLoad (node:internal/modules/esm/load:120:20)
at ModuleLoader.load (node:internal/modules/esm/loader:396:13)
at ModuleLoader.moduleProvider (node:internal/modules/esm/loader:278:56)
at new ModuleJob (node:internal/modules/esm/module_job:65:26)
at ModuleLoader.#createModuleJob (node:internal/modules/esm/loader:290:17)
at ModuleLoader.getJobFromResolveResult (node:internal/modules/esm/loader:248:34)
at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:229:17)

[Erij-Maherzia-BEN-BRAHIM]

Check your TypeScript configuration in tsconfig.json to ensure that it includes support for ".tsx" files. Make sure that the TypeScript compiler is configured to handle JSX/TSX syntax. Check the documentation 👇🏻
https://remix.run/docs/en/main/guides/migrating-react-router-app#jsconfigjson-or-tsconfigjson

[mweel1]

@Erij-Maherzia-BEN-BRAHIM I do have those things in my project.

I am using mono-repo I'm not sure if that would make any difference. I can load .tsx files from within my project.

[mweel1]

Found it, needed to include this..

serverDependenciesToBundle: ["ui/components/format/formatPhoneNumber"],