Typescript: 每个项目支持多个tsconfig.json

创建于 2015-06-26  ·  37评论  ·  资料来源: microsoft/TypeScript

嗨! 每个项目是否可以使用多个tsconfig.json ,即位于根目录中的某种项目范围的tsconfig.json位于子目录中的其他tsconfig.json文件可能会覆盖/调整这些选项的一些选项? 就像.gitignore一样。

例如,在node -environment下开发外部模块时,这将非常有用。 此类模块通常拆分为多个文件(内部模块),但在编译阶段将被编译为一个大文件。

Question

最有用的评论

我终于找到了解决方案。

我的应用程序结构:
-应用/-应用程序/客户端/(我的客户端源代码)-应用程序/服务器/(我的服务器端源代码)-app / build /(我在其中生成js)-应用程序/节点模块/-app / package.json-app / tsconfig.server.json-app / tsconfig.client.json

tsconfig.server.json的内容:
{“ compilerOptions”:{...,“ outDir”:_“ build / server” _},“排除”:[“ node_modules”,“客户端”]}

tsconfig.client.json的内容:
{“ compilerOptions”:{...,“ outDir”:“ build / client”},“排除”:[“ node_modules”,“服务器”]}


然后,当我想编译服务器源代码时,请从应用程序根目录使用以下命令:

tsc --p tsconfig.server.json


并从根应用目录编译客户端源代码:

tsc --p tsconfig.client.json


为了同时运行客户端和服务器编译,我在package.json中添加了一个命令:

“脚本”:{...,“ tsc”:“ tsc --p tsconfig.server.json && tsc --p tsconfig.client.json”,...}

然后,要编译服务器和客户端,只需在根应用目录下运行即可:

npm运行tsc

希望此评论可以对您有所帮助:-)

所有37条评论

嘿@lazutkin。 当前不支持该功能,尽管我只想将此问题链接到#2869,因为它有些相关。

如果运行tsc文件夹中没有任何参数,则编译器会选择最接近您正在构建的tsconfig.json。 因此,如果您的内部目录带有tsconfig.json,它将在外部目录中的目录之前被拾取。

我认为我们不会支持来自多个tsconfig.json的集成/覆盖配置。

对于大型企业应用程序,多个tsconfig文件是必不可少的。
建议:每次tsc在子目录中找到新的tsconfig文件时,tsc都会在此处停止,并使用自己的tsconfig文件创建一个新的tsc进程。

@Eisenspalter这听起来像是构建驱动程序,类似grunt,gulp或msbuild。

@mhegazy我同意@Eisenspalter,因为我们typescript支持,包括智能感知,类型检查等。此外,正如我之前所说,对于项目的不同部分,我们希望应用不同的源组织技术(外部-内部模块,单个输出文件等),这里我们需要一些单独的tsconfig覆盖的选项。

@mhegazy为什么关闭? 请重新打开。

您今天可以拥有多个tsconfig,每个都指向重叠的文件集。 因此,一个在srctsconfig.json处,一个在teststsconfig.json中,依此类推。编译器/工具将通过在目录树中查找最接近的树来定位文件。 因此,您可以在根目录中拥有第三个文件来捕获所有文件。

如今,这一切都可以在编译器和不同的IDE中使用。 最初的问题是关于允许文件从另一个继承。 我认为没有足够的价值来保证复杂性。

对于第二期:

每次tsc在子目录中找到新的tsconfig文件时,tsc都会在此处停止,并使用自己的tsconfig文件创建一个新的tsc进程。

如前所述,tsconfig.json表示对tsc.js / tsc.exe的单个调用,如果要执行多个调用,则应使用构建驱动程序。

@lazutkin@Eisenspalter会回答问题

@mhegazy
无法使多个tsconfig.json正常工作。 至少使用TypeScript 1.7.3,仅读取一个tsconfig.json,并且该tsconfig.json应当位于项目的根目录(或父目录)中。

@Ziink我上面的评论不是关于同一项目中的多个tsconfig的。 它涉及多个项目/目录,每个项目/目录具有不同的tsconfig。 ts项目的布局方式,请参见https://github.com/Microsoft/TypeScript/tree/master/src(src下的每个文件夹都有一个不同的tsconfig.json)

我有一个用TypeScript编写的项目,并且我希望两者都针对:

  1. 带有ES5 / AMD的浏览器(例如/browser )和
  2. 带有CommonJS和生成器(以及TS中的async / await)的nodejs( server文件)。

在( /common )文件夹中有一些共享文件,并且有从commonbrowserserver导入。
如何获得保留IDE支持,所有错误等的配置? 我不确定讨论是否回答了我的疑问。

@bartq对于TS 1.8,我将创建两个tsconfig文件,一个用于浏览器,一个用于服务器,然后在两个子项目的文件中将///引用添加到公共项目中。 尝试一下,让我们知道这是否解决了该情况,或者仍然有遗漏的部分。

实际上我正在使用这两个tsconfig.json文件,WebStorm会发现它们并自动运行编译。 确切地说,后端代码从前端代码中导入了一些类(而不是使用common概念),但是一切正常。

我终于找到了解决方案。

我的应用程序结构:
-应用/-应用程序/客户端/(我的客户端源代码)-应用程序/服务器/(我的服务器端源代码)-app / build /(我在其中生成js)-应用程序/节点模块/-app / package.json-app / tsconfig.server.json-app / tsconfig.client.json

tsconfig.server.json的内容:
{“ compilerOptions”:{...,“ outDir”:_“ build / server” _},“排除”:[“ node_modules”,“客户端”]}

tsconfig.client.json的内容:
{“ compilerOptions”:{...,“ outDir”:“ build / client”},“排除”:[“ node_modules”,“服务器”]}


然后,当我想编译服务器源代码时,请从应用程序根目录使用以下命令:

tsc --p tsconfig.server.json


并从根应用目录编译客户端源代码:

tsc --p tsconfig.client.json


为了同时运行客户端和服务器编译,我在package.json中添加了一个命令:

“脚本”:{...,“ tsc”:“ tsc --p tsconfig.server.json && tsc --p tsconfig.client.json”,...}

然后,要编译服务器和客户端,只需在根应用目录下运行即可:

npm运行tsc

希望此评论可以对您有所帮助:-)

我不明白这里出了什么问题。 为什么我们不能支持具有不同文件名的配置? 必须创建subFolders仅具有不同的tsconfig文件,这是一个痛苦。

您可以。 --p参数可以是文件名。

但是,不同的文件名不能与Visual Studio打字稿编译器扩展(不是在谈论CLI)一起使用。 唯一的方法是将每个tsconfig.json放入一个虚拟目录中,并使用files选项将其链接回所需的打字稿。

例如

--src / target / search / tsconfig.json
--src / target / core / tsconfig.json
--src / target / users / tsconfig.json

target / search / tsconfig.json如下所示:

{
  "compilerOptions": {
    "outFile": "../../../build/app/search.js"
  },
  "files": [
    "../../src/common",
    "../../src/search"
  ]
}

而其他的将是相似的。

这将产生3个javascript文件,每个文件具有自己的文件配置,并捆绑在一起。

当然,您可以使用与Typescript编译器本身不同的捆绑/最小化/打包解决方案。

只是Typescript编译器在优化方面做得非常好-这是使用Typescript的最大吸引力之一。

因此,如果单个tsconfig.json只需将其更改为tsconfigs数组即可支持多种配置,那就太好了:

[
  {
    "compilerOptions": {
      "outFile": "../../build/search.js"
    },
    "files": [
      "src/common",
      "src/search"
    ],
    "compileOnSave": true
  },
  {
    "compilerOptions": {
      "outFile": "../../build/core.js"
    }
    "files": [
      "src/common",
      "src/core"
    ],
    "compileOnSave": true
  }
]

这听起来像是在此问题的后续评论中所要求的,尽管我同意,但最初的问题更多是关于继承和覆盖配置。

@mhegazy @bartq我无法使其与tsc命令一起使用。
我有以下目录结构

-- app/
-- app/server  -- here I want es6/commonjs
-- app/server/tsconfig.json
-- app/client    -- here I want es6/es6 
-- app/client/tsconfig.json
-- app/tsconfig.json

但是,当我运行tsc仅使用app/tsconfig.json中的配置,其余部分将被忽略。 我正在尝试使其在VSCode中起作用:/

@tomitrescak我正在使用WebStorm,它足够智能,可以找到最接近的tsconfig.json并在编辑文件时使用它。 可能没有任何支持观看多个tsconfig.json的cmd工具。 您可以使用例如FB watchman将其推出。

是的,我很想在VS Code中拥有这样的东西。 我正在终端中运行编译。 也可以。 无论如何,VS Code都能正确识别错误。

多个配置会很棒。 我正在做一个React-Native项目,基本上我想做两个构建:

  1. 我的React-Native项目的脚本
  2. HTML中用于React-Native WebViews的脚本(图表)。

配置继承已在TS 2.1中添加,今天应该在typescript@next可用。 有关更多详细信息,请参见https://github.com/Microsoft/TypeScript/issues/9876 。 有了它,您可以拥有一个“主” tsconfig.json并覆盖从其继承配置的那些。 您仍然需要创建多个tsconfig.json文件,但是您的IDE应该选择这些文件。

我有以下目录结构:

├── examples
│   ├── files...
│   └── tsconfig.json
├── src
│   └──files...
└── tsconfig.json

tsconfig.json具有:

{
  "compilerOptions": {
    "target": "es2015",
    "module": "commonjs",
    "moduleResolution": "node",
    "outDir": "dist",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "declaration": true,
    "allowJs": false
  },
  "include": [
    "./src"
  ],
  "compileOnSave": false,
  "buildOnSave": false,
  "atom": { "rewriteTsconfig": false }
}

examples/tsconfig.json具有相同的值,除了:

  "include": [
    "./hello-world"
  ],

当我做:

cd examples
tsc

它编译为:

├── examples
│   ├── dist
│   │   ├── examples
│   │   └── src
│   ├── files...
│   └── tsconfig.json
├── src
│   └──  files...
└── tsconfig.json

dist错误包含外部文件夹src并从根文件夹中进行编译)

无济于此(在examples/tsconfig.json ):

  "exclude": [
    "../src"
  ],

我究竟做错了什么?

我发现了问题。 如果在我的examples/hello-world/any-file*.ts此导入:

import { SomeClass } from '../../src';

它产生上述问题。 预期的导入工作如下:

import { SomeClass } from '../../';

但是,为什么打字稿指令include不能按预期工作?

我无法正常工作
它坚持要求“警告:找不到父tsconfig.json”,尽管我在同一文件夹中有tsconfig.json,但不知道该怎么做

@zhukovka,请使用我们可以在本地运行的独立

@RyanCavanaugh哦。 谢谢,我知道了
仅当我从测试文件夹(不包含tsconfig.json)打开一个文件,并且在“ src”文件夹(包含tsconfig.json)中打开第二个文件时,问题才会重现
test文件夹中的文件将从src文件夹中导入一个文件。 在这种情况下,src文件夹中的文件看不到他的“父tsconfig.json”

@RyanCavanaugh,与几个不同tsconfig.json的收集支撑似乎继续是一些开发商想拥有。 就我而言,它通常与更改生成的输出文件的位置有关。 似乎如果代码生成可以通过现有的paths映射进行控制,使我可以将生成的代码与源代码进行不同的布局,则可能会减少对多个项目的需求。

我的用例是,我有一个庞大的旧代码库,无法承受更严格的类型检查规则,并且我想在_does_启用了严格检查的新代码库中使用它,而我无法将旧代码编译为库,因为它有一百万个案例,其中没有导入命名其导出类型所需的所有类型(#9944)。 因此,我只想将旧代码库添加到新代码库中,但要根据宽松规则进行编译。 这不能是2个不同的编译步骤。 仅当编译器正在处理某个目录下的源文件时,它才应使用宽松规则。

对我而言,用例具有使用节点运行的仓库的一部分,需要编译为commonjs模块,而另一部分则需要编译为ES6模块,以便在ES6中启用树状交换。 体验不是很好,就我而言,有很多关于TS_NODE_PROJECT环境变量的技巧。 当我最终更改项目时,似乎肯定会使下一个维护它的人感到困惑。

我仍然希望看到这个解决方案。 对于在一个项目中每个模块需要不同的tsconfig.json文件的大型项目,这将是一个巨大的胜利。

@Robinfr extends功能不能为您解决什么?

它做了。 我在这篇文章之后发现了这一点。 但是要注意的一件事是,如果不将include到k通常不需要的文件中就无法工作,因为k通常是通过webpack传递的。

9月15日。 2017年9月24日上午schreef Kitson Kelly [email protected]

@Robinfr https://github.com/robinfr扩展功能有什么https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends不能为您解决?

-
您收到此邮件是因为有人提到您。
直接回复此电子邮件,在GitHub https://github.com/Microsoft/TypeScript/issues/3645#issuecomment-329703706上查看,或使线程https://github.com/notifications/unsubscribe-auth/AD90FLZKcHMJeFU0osJroT_yawlC1oTIks5siiZFgaJpZM4FMc8w静音。

@kitsonk扩展效果很好,尽管如果我没有做错什么,我必须在两个配置中都重复某些设置(不包括build和node_modules文件夹)。 对我来说,最大的麻烦是确保我的所有工具都知道哪个配置文件也是正确使用的(通常是通过TS_NODE_PROJECT环境变量之类的方式。另一个是在打开带有两个tsconfigs的项目时VS.code。(我知道)没有办法告诉VS使用哪个项目文件,这意味着对于某些文件,由于对应tsconfig中这些文件的设置不同,因此错误不会正确加下划线(例如,像tsconfig.build.json)。

@voy请问为什么您要使用其他tsconfig进行构建? 据我了解,VSCode使用最接近您正在编辑的文件的tsconfig文件( tsconfig.json )。 到目前为止,我唯一遇到的问题是,在VSCode似乎完全开始使用配置之前,您需要在根目录下有一个tsconfig文件。

@Robinfr当然。 在同一存储库中,我拥有使用webpack和babel处理过的文件,并使用ES6模块来启用树状摇动。 其他文件是构建过程的一部分,并使用node执行,这就是为什么导入需要转换为require的原因。 不知道我该如何解决。

@voy您不会只是将这些文件放在单独的文件夹中吗? 例如,所有Babel和webpack文件的文件夹为1,节点文件的文件夹为1。 然后,对于每个这些文件夹,您都可以拥有一个tsconfig.json。 那对你有用吗?

@Robinfr会很理想,但我认为在现实世界中并非总是可能的。 例如,我们也希望我们所有的配置文件也都为打字稿,并按照与所有TypeScript代码库完全相同的规则进行编译和插入,并且某些文件必须位于项目的根目录中。 您可以进行符号链接,但这有时会带来其他问题。 这就是为什么我觉得更灵活一些会有所帮助。

此页面是否有帮助?
0 / 5 - 0 等级