如何在 monorepo 中提取到 package 的常见反应挂钩？

Question

我正在尝试提取一些常见的钩子，这些钩子将在多个nextjs应用程序中的多个项目中使用。 但我一直遇到以下错误

error - ../../packages/web-hooks/useClientDimensions.tsx
Module parse failed: Unexpected token (3:7)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

我将问题缩小到webpack无法将 package 处理为typescript 。

文件夹结构

|
|__ apps
|  |__react-native-app
|  |__next-app
|__ backend
|  |__express-app
|__ packages
   |__ web-hooks
   |__ native-hooks

我没有对nextjs package.json和tsconfig.json文件进行任何更改。

包/web-hooks/package.json

{
    "name": "web-hooks",
    "version": "1.0.0",
    "main": "index.ts",
    "private": true,
    "scripts": {},
    "devDependencies": {
        "typescript": "4.7.4"
    },
    "peerDependencies": {
        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
    },
    "keywords": [],
    "author": "",
    "license": "ISC"
}

包/web-hooks/tsconfig.json

{
    "compilerOptions": {
        "declaration": true,
        "declarationMap": true,
        "target": "ES5",
        "jsx": "react",
        "module": "CommonJS"
    }
}