Lerna с Yarn, TypeScript и React Native: не удается найти модуль '@ project / common' или его соответствующие объявления типов. Ts (2307)

В проекте используются Yarn, React Native, Lerna и Typescript. Он структурирован как монорепозиторий

Вот структура:

project
|- packages
   | - mobile
       | - src
       | - packages.json
       | - tsconfig.json
   | - cloud-functions
       | - src
       | - packages.json
       | - tsconfig.json
   | - common1
       | - lib
       | - src
       | - packages.json
       | - tsconfig.json
   | - common2
       | - lib
       | - src
       | - packages.json
       | - tsconfig.json
| - packages.json
| - tsconfig.json
| - lerna.json

lerna.json выглядит так:

{
  "packages": [
    "packages/*"
  ],
  "npmClient": "yarn",
  "version": "0.0.7",
}

Корневой файл packages.json выглядит так:

{
  "name": "project",
  "private": true,
  "scripts": {
    ...
  },
  "devDependencies": {
    "@types/node": "^14.0.27",
    "lerna": "^3.22.1",
    "ts-node": "^8.10.2",
    "typescript": "^3.9.7"
  }
}

Корневой файл tsconfig.json выглядит так:

{
  "compilerOptions": {
    "noImplicitAny": true,
    "noUnusedLocals": true,
    "removeComments": true,
    "noLib": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "baseUrl": "./",
    "paths": {
      "@project/common1": ["packages/common1/lib"],
      "@project/common2": ["packages/common2/lib"],
      "@project/mobile": ["packages/mobile/src"],
      "@project/cloud-functions": ["packages/cloud-functions/src"],
    }
  },
  "exclude": ["node_modules", "**/*.spec.ts", "**/__tests__/*", "babel.config.js", "metro.config.js", "jest.config.js"]
}

Типичный пакет / common / packages.json выглядит так:

{
  "name": "@project/common1",
  "version": "0.0.7",
  "main": "lib/index.js",
  "types": "lib/index.d.ts",
  "files": [
    "lib/**/*"
  ],
  "private": true,
  "devDependencies": {
    "@project/common2": "latest", //for common1 only
    "@types/node": "^14.0.27",
    "ts-node": "^8.10.2",
    "typescript": "^3.9.7"
  },
  "dependencies": {
    ...
  }
}

Типичные пакеты / common / tsconfig.json выглядят так:

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "module": "commonjs",
    "outDir": "lib",
    "strict": true,
    "target": "es6"
  },
  "compileOnSave": true,
  "include": ["src"]
}

Файл packages / mobile / packages.json в React Native выглядит так:

{
    "name": "@project/mobile",
    "version": "0.0.7",
    "private": true,
    "dependencies": {
        "@project/common1": "latest",
        "@project/common2": "latest",
        ...
    },
    "devDependencies": {
        ...
        "ts-node": "^8.10.2",
        "typescript": "^3.8.3"
    },
}

Я впервые столкнулся с:

lerna ERR! yarn install --mutex network:42424 --non-interactive stderr:
warning Waiting for the other yarn instance to finish (19560)
warning Waiting for the other yarn instance to finish (21568)
error An unexpected error occurred: "https://registry.yarnpkg.com/@project%2fcommon1: Not found".

Очевидно, Yarn пытается извлечь зависимости из реестра своих пакетов. Это не удается.

Затем я попытался удалить ссылки на @ project / common1 и @ project / common2 в зависимостях пакетов.

В исходном коде VS Code подчеркивает импорт красным и печатает:

Cannot find module '@project/common1' or its corresponding type declarations.ts(2307)

Я также пробовал использовать Yarn Workspace, но столкнулся с проблемами подъема модулей с React Native. Я не хотел создавать список всех возможно несовместимых пакетов, так как кажется, что его сложно поддерживать.

"workspaces": {
  "nohoist": ["react-native", "react-native/**", "@react-native-community/checkbox", "@react-navigation/native"]
}

Есть простое решение?

Или для этого варианта использования проще отказаться от Lerna и использовать общие репозитории на основе GitHub?


react-native typescript yarnpkg lerna monorepo
person Xiiryo    schedule 19.08.2020    source источник
comment
Вы создали репозиторий пакетов с помощью lerna cli или вручную, поскольку lerna настроил его для вас?   -  person tmhao2005    schedule 19.08.2020
comment
Я создал его вручную, так как мне нужно было внести некоторые изменения в Typescript, а проект уже существовал.   -  person Xiiryo    schedule 19.08.2020
comment
У вас все равно есть воспроизводимое репо, чтобы я мог посмотреть?   -  person tmhao2005    schedule 20.08.2020
comment
Я просматривал учебные пособия в Интернете, и все они используют для этой цели рабочее пространство Yarn. В противном случае они используют пакет импорта из '../../packages/package. Думаю, я просто пытался заставить его работать неправильно. Я добавил рабочую область Yarn, перечислил модули nohoist и удалил путь из tsconfig.json. Теперь работает ...   -  person Xiiryo    schedule 20.08.2020

Ответы (1)


arrow_upward
0
arrow_downward

Я не знаю, является ли это наиболее простым подходом, но я мог бы заставить его работать, добавив рабочие области Yarn.

В основном файле packages.json я добавил:

  "workspaces": {
    "packages": [
      "packages/*"
    ],
    "nohoist": [
      "**mobile**",
      "**react**",
      "**react-native**",
      ...
    ]
  },

В Lerna.json я добавил:

  "useWorkspaces": true,

Из корня tsconfig.json я удалил:

    "baseUrl": "./",
    "paths": {
      "@project/common1": ["packages/common1/lib"],
      "@project/common2": ["packages/common2/lib"],
      "@project/mobile": ["packages/mobile/src"],
      "@project/cloud-functions": ["packages/cloud-functions/src"],
    }
person Xiiryo    schedule 20.08.2020