I have a "next": "13.4.9" app and "@trpc/server": "^10.34.0" on a backend I can import types from my backend to the frontend but when I import anything that would then run in the runtime I get error
../api/src/utils/functions.ts
Module parse failed: Unexpected token (1:32)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> export function trimEndZeros(str: string | undefined) {
| if (!str || isNaN(Number(str))) {
| return "0";
Import trace for requested module:
../api/src/utils/functions.ts
./src/components/leader/Levels.tsx
./src/components/leader/Leader.tsx
I have a yarn workspaces monorepo this is my root tsconfig
{
"files": [],
"references": [{ "path": "./packages/api" }, { "path": "./packages/web" }]
}
this is for the backend
{
"compilerOptions": {
"composite": true,
"strict": true,
"skipLibCheck": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"target": "ES6",
"module": "ESNext",
"rootDir": ".",
"moduleResolution": "node"
}
}
and this is for the frontend
{
"compilerOptions": {
"composite": true,
"target": "ES6",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"plugins": [
{
"name": "next"
}
],
"paths": {
"@/*": ["./src/*"],
"@api/*": ["../api/src/*"]
}
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx",
".next/types/**/*.ts",
"../api/src/**/*"
],
"references": [
{
"path": "../api"
}
],
"exclude": ["node_modules"]
}
if anyone would be able to tell me what is wrong with my setup please tell me. Do i really need some addidtional loader? Nextjs would not handle it by default? Thanks.