如何将 single-spa in-browser 实用程序模块导入 TypeScript parcel 项目

Question

我下面有 3 个 TypeScript 项目：

以上所有项目都是使用create-single-spa命令生成的。

在 api/src/lomse-api.ts 文件中，我正在导出 fetchPeople 模块，如下所示：

export { fetchPeople } from "./PeopleApi.ts";

根据 single-spa documentation，鉴于我的 orgName 是 lomse 并且 projectName 是 api，我应该可以导入 fetchPeople 模块到 my-app（包裹应用程序），如下所示：

import { fetchPeople } from '@lomse/api'

由于my-app项目是TypeScript项目，上面的语句肯定会抛出如下错误：

Cannot find module '@lomse/api' or its corresponding type declarations.

有办法解决这个问题吗？

Answer 1

该错误是 TypeScript 错误，而不是 JavaScript 或 single-spa 错误。以下是您需要执行的选项：

使用 Node.js 兼容的模块格式（UMD、Commonjs）将您的实用程序模块发布到注册表（类型是可选的，因为 TS 可以从源代码推断，但类型更好）。然后将其安装到彼此的微前端 node_modules 中。由于是 webpack external，node_modules 中的版本只会用于 typescript 编译，不会用于在浏览器中执行。但是，这可能需要第二次构建，并且可能会因互操作差异而产生问题。
您可以只发布模块类型，无论是作为单独的包还是与其他微前端的类型一起发布。
模拟实用程序模块的类型，如所述。

来源：

How to import a single-spa in-browser utility module into a TypeScript parcel project