繁体   English   中英

如何让 VS Code 识别 mono-repo 包之间的打字稿声明?

How can I make VS Code recognize typescript declarations between mono-repo packages?

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我有一个配置了独立库包(仅限 TS)和另一个 Web UI 包(TS + React)的单回购项目。

我正在从消费者(Web UI)包中导入编译后的库包。 为此,我使用纱线链接包和包裹以生成库包的分发文件。

Parcel 会在库包的dist文件夹中自动生成一个d.ts文件。

我使用 VS Code 作为 IDE,当我打开导入库并使用它的消费者包文件时,VS Code 无法识别库包的d.ts文件中声明的类型。

这是包的结构:

rootPackage
|- library
|- web-ui

library包中,我有一个types.ts文件和一个index.ts文件。 只有一种类型被导出:

export type ParamType = "a" | "b" | "c";

我在这个包上使用了parcel watch来在某些内容发生变化时自动刷新dist文件。

Parcel 正在生成main.d.ts文件就好了,这个文件被package.jsontypes属性引用。

当我尝试通过web-ui包的代码使用此ParamType类型时,我在类型中突出显示了以下 IDE 错误:

Cannot find name 'ParamType'.ts(2304)

当我在web-ui包中运行包时,它编译得很好,浏览器加载时没有问题/警告。

我认为这是一个专门与 VS Code 相关的问题,我不知道如何解决它。


编辑 1

在 GitHub 上创建了一个公共存储库来演示这个问题。 如果您知道如何修复它,请随时创建拉取请求,这将非常有帮助。

1 个回复

从您的示例 repo 中,您的library包的根目录如下所示:

/shared/lib/src/index.ts

import { ParamType } from "./types";

const Library = {
  typedParamMethod(param: ParamType) {
    console.log(param);
  },
};

export default Library;

你在web-ui包中使用library包的方式是这样的:

/ui/web/src/App.tsx

import React from 'react';
import Library from 'library';

function App() {
  React.useEffect(() => {
    const typedParam: ParamType = 'b'; // VSCode and tsc throw the error "Cannot find name 'ParamType'." 
    Library.typedParamMethod(typedParam);
  }, []);

  return (
    <div className="web-ui">Web UI</div>
  );
}

export default App;

问题是您既没有将ParamTypelibrary包的根目录导出,也没有将其导入web-ui包。 现代 JavaScript 和 Typescript 模块彼此隔离 - library包根目录中的import { ParamType } from "./types" ParamType在该文件中可用,但它不会影响(或污染)某些东西的全局命名空间这恰好从library包中导入了其他东西(例如默认导出)。

要解决此问题,请将此行添加到library包根目录(例如/shared/lib/src/index.ts ):

export { ParamType } from "./types.ts";

然后修改web-ui包中的导入(在/ui/web/src/App.tsx中:

import Library, { ParamType } from 'library';

(问题和解决方案与 VSCode 无关 - 任何尝试对web-ui包进行类型检查的内容都会发出相同的错误,没有这些更改)

1 如何在 TypeScript 单一仓库中使用 React Cosmos

我无法让React Cosmos在 TypeScript monorepo 中工作。 虽然很简单,但他们的指令在单个包中适用于 TypeScript,但是一旦我尝试在 monorepo 中使用来自另一个 TypeScript 包的代码,它就会抱怨它不理解类型语法(显然它没有转换共享文件) . 为 ...

2 如何在不经过构建周期的情况下设置具有多级依赖关系图的 Typescript 单存储库?

我有一个包含 3 个包的 typescript mono-repo,如下所示: 包 A:一个 React 单页应用程序,它使用包 B 和 C。 包 B:使用包 C的 UI 库。 包 C:具有第 3 方依赖项的实用程序包。 我的目标是在开发过程中每次更改依赖项后避免构建周期,因此我想 ...

3 Mono-repo文件结构

我正在尝试将我们的存储库重组为基于Trunk的单仓库结构化仓库。 它仅包含按功能分为类别的javascript文件。 但是,我努力了解的一件事是mono-repo的文件结构和版本控制。 您还有多个版本吗? 就目前而言,我具有以下结构: NetSuite ERP ...

4 如何使VS代码识别回购协议自身的毛发设置

我找不到此设置。 也许我使用错误的关键词进行搜索。 如果我这样做,请纠正我。 我在不同的仓库上工作,每个仓库都有自己的陪同设置。 但是我的VScode在每个设置上都使用了它的全局设置,导致我的代码最后没有通过管道。 如何更改VScode设置? 因此,它可以看到该文件夹​​具有自己的eslint文 ...

5 带有 Terragrunt/Terraform 单一存储库的 CI/CD

我在一个单一仓库中使用 Terragrunt,如下所示用于多个项目和环境: 我已经读过,在使用 Terragrunt 时,最佳做法是在需要部署的模块上运行plan / apply命令,而不是run-all apply它将递归地在所有模块上运行 apply 这有时会破坏事情( ?)。 我还被 ...

6 将 mono-repo 与 Google Cloud Functions 结合使用

我有多个 nodejs 函数共享相同的存储库和依赖项。 正如官方 GCF 文档中所建议的,我使用一个index.js文件来公开多个函数入口点,如下所示: 然后我多次执行gcloud functions deploy命令来部署这些函数并附加它们各自的 PubSub 主题。 因此,整个包通过具有相同 ...

7 从Mono-repo中仅从名称空间/类型NPM模块自动导入Typescript名称空间

我有许多私有存储库,它们反复使用相同的Typescript类型,因此,我没有将它们从一个项目复制到另一个项目,而是创建了一个私有NPM程序包,该程序包在Typescript命名空间下容纳所有这些共享类型。 如果每个项目都使用共享类型,则将安装该NPM软件包。 索引 使用这些类型的项目之一是具有 ...

9 如何使Sphinx识别源代码可以识别的程序包

我正在使用Sphinx记录我正在使用Python 3.9进行的网络抓取项目。 作为该过程的一部分,我从yaml文件中读取了API密钥。 当我测试它时,代码可以正常工作。 但是,当我尝试使用sphinx记录代码时,出现一条错误消息,告诉我autodoc无法导入yaml,因为它无法识别。 我该如何解决? ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2021 STACKOOM.COM