我使用的是Visual Studio代码，并且有一个相当常见的项目结构：
├── client/
│ ├── tsconfig.json
├── shared/
├── server/
│ ├── tsconfig.json
├── project.json
两个tsconfig文件具有不同的设置(例如，client/下的一个目标为ES5，server/下的那个目标为ES6)。请注意，根目录中没有tsconfig。
问题是，我希望共享目录包含在两个项目中。我不能使用tsconfig来做到这一点，因为exclude选项不允许我包含比tsconfig.json更高目录中的文件夹，而使用files，我必须不断更新文件列表，因为它不支持globs。
请注意，我可以通过将共享文件夹添加到tsc中来进行精细编译，我想要的是Visual Studio Code IDE识别intellisense等的共享代码。
等待filesGlob的唯一选项是什么？
现在它变得容易多了，因为vscode对此有更好的支持。
你可以使用这个目录结构，这样所有的代码都是独立的：
├── frontend/
│ ├── src/
│ │ ├── <frontend code>
│ ├── package.json
│ ├── tsconfig.json
├── shared/
│ ├── package.json
├── backend/
│ ├── src/
│ │ ├── <backend code>
│ ├── package.json
│ ├── tsconfig.json
然后在后端和前端tsconfig.json:
{
"compilerOptions": {
"paths": {
"~shared/*": ["../shared/*"]
},
"rootDirs": [
"./src",
"../shared"
]
}
}
允许访问共享代码，例如：
import { Foo } from '~shared/foo';
旧答案
使用单个tsconfig.json作为根。然后将其扩展到每个项目(后端tsconfig.server.json、前端tsconfig.webpack.json)。
- 根
tsconfig.jsoninclude: ['src']以确保在IDE中对所有文件进行类型检查 - 后端
tsconfig.server.jsonexclude: ['src/app']前端文件 - 前端：
tsconfig.webpack.jsonexclude: ['src/server']后端文件
文件夹结构
├── src/
│ ├── app/ < Frontend
│ ├── server/ < Backend
│ ├── common/ < Shared
├── tsconfig.json
├── tsconfig.server.json
├── tsconfig.webpack.json
配置文件
tsconfig.json
{
"compilerOptions": {
"noImplicitAny": true,
"strictNullChecks": true
},
"include": [
"src"
]
}
tsconfig.webpack.json
{
"extends": "./tsconfig.json",
"exclude": [
"src/app"
]
}
tsconfig.server.json
{
"extends": "./tsconfig.json",
"exclude": [
"src/server"
]
}
更多
示例课(由我)
正如其他人所提到的，如果前端和后端有不同的类型，现有的答案并不能解决问题——几乎在所有情况下都是这样，因为前端代码支持DOM(而不是node.js标准库)，而后端代码支持node.js标准库(通常不是DOM)
具有顶级tsconfig.json意味着dom代码将在前端代码中显示为错误(如果dom是库)，或者dom代码将被允许在后端代码中(如果省略dom)。
这是一个有效的解决方案：
文件夹结构
我们的项目往往是"默认情况下的后端"，有一个用于前端代码的特定文件夹。
├── src/
│ ├── frontend/ < Frontend
│ │ ├── `tsconfig.json` (extends frontend framework defaults, eg Svelte)
│ ├── http/ < Backend
│ ├── events/ < Backend
├── tsconfig.json `tsconfig.json` (backend tsconfig)
后端tsconfig.json
这通常是相当小的。我们使用jest进行测试，并使用es2019JS stdlib。
{
"compilerOptions": {
"target": "esnext",
"module": "commonjs",
"outDir": "dist",
"moduleResolution": "node",
"esModuleInterop": true,
"lib": ["es2019"],
"types": ["jest"],
},
"exclude": [
"node_modules",
"public/*",
"src/frontend/*"
],
"include": ["src/**/*"]
}
前端tsconfig.json
这是针对Svelte的，但在旧的框架中也可以类似地工作。前端有不同的类型，因为它支持.svelte文件和dom
{
"extends": "@tsconfig/svelte/tsconfig.json",
"compilerOptions": {
// Default included above is es2017
"target": "es2019",
},
"lib": ["es2019", "dom"],
}
前端专用工具
使用单独的tsconfig文件进行汇总：
export default {
input: ...
output: ...
plugins: [
...
typescript({
tsconfig: "src/frontend/tsconfig.json",
sourceMap: isDevelopment,
inlineSources: isDevelopment,
}),
...
],
...
};
我在这里回答了这个问题：tsconfig扩展回答
答案的要点：
您可以通过扩展基本tsconfig.json文件来实现这一点：
tsconfig扩展
只是不要排除基本tsconfig.json中的目录，typescript应该能够为您解析您的打字员(使用node_modules/@types或打字员模块知道这是真的)
例如：
configs/base.json:
{
"compilerOptions": {
"noImplicitAny": true,
"strictNullChecks": true
}
}
tsconfig.json:
{
"extends": "./configs/base",
"files": [
"main.ts",
"supplemental.ts"
]
}
tsconfig.nostricknull.json:
{
"extends": "./tsconfig",
"compilerOptions": {
"strictNullChecks": false
}
}
作为另一种变体，将npm命令与下一次运行绑定：
{
'start': '...',
'buildFront': 'tsc -p tsconfig.someName.json'
}
新版本的VSCode支持Typescript 2，添加这一功能可通过include选项在tsconfig.json中添加对globs的支持。看见http://www.typescriptlang.org/docs/handbook/tsconfig-json.html