beatrizsmerino / beatrizsmerino/angular-setup

fix(tsconfig): add missing `rootDir` property to resolve `VSC` warning

Open
#5 0 comments 0 reactions 1 assignee Claimed by @beatrizsmerino View on GitHub
bug configuration
Dominant language
No language data
Stars
0
Forks
0
PR merge metrics
No merged PRs in 30d

Description

# fix(tsconfig): add missing `rootDir` property to resolve `VSC` warning

| ⏱️ Estimate | 📊 Priority | 📏 Size | 📅 Start | 📅 End |
| --- | --- | --- | --- | --- |
| 1h | P0 | XS | 02-03-2026 | 02-03-2026 |

## 📸 Screenshots

### VSC warning for missing `rootDir`
| Current | Expected |
| :---: | :---: |
| Image Image | Image Image |

### Build output with analytics prompt
| Current | Expected |
| :---: | :---: |
| N/A — This change has no visual impact. | Image |

## 📝 Summary

- Add `rootDir` property to `tsconfig.app.json` and `tsconfig.spec.json`
- Resolve `TypeScript` warning in `VSC` about missing `rootDir` when `outDir` is set

## 💡 Why this bug?

> [!WARNING]
> ```
> The common source directory of 'tsconfig.app.json' is './src'. The 'rootDir' setting must be explicitly set to this or another path to adjust your output's file layout.
> Visite https://aka.ms/ts6 para obtener información sobre la migración.ts
> ```
> ```
> The common source directory of 'tsconfig.spec.json' is './src/app'. The 'rootDir' setting must be explicitly set to this or another path to adjust your output's file layout.
> Visite https://aka.ms/ts6 para obtener información sobre la migración.ts
> ```

- The `TypeScript` language service requires `rootDir` when `outDir` is defined
- Without `rootDir`, `TypeScript` cannot determine how to replicate the source directory structure in the output folder
- The warning appears in `VSC` but does not affect the `Angular` build (`@angular/build:application` uses `esbuild` internally)

## ✅ Expected behavior

- No `TypeScript` warnings in `VSC` for `tsconfig.app.json` and `tsconfig.spec.json`
- The `Angular` build and tests continue to work correctly

## 📋 Steps

### Phase 1: Update `tsconfig.app.json`
- [x] Add `rootDir` property:

```diff
"compilerOptions": {
"outDir": "./out-tsc/app",
+ "rootDir": "./",
"types": []
},
```

### Phase 2: Update `tsconfig.spec.json`
- [x] Add `rootDir` property:

```diff
"compilerOptions": {
"outDir": "./out-tsc/spec",
+ "rootDir": "./",
"types": [
"vitest/globals"
]
},
```

### Phase 3: Enable local analytics in `angular.json`
- [x] Add `analytics` property to `cli` section:

```bash
npm run build
```
```text
Would you like to share pseudonymous usage data about this project with the Angular Team
at Google under Google's Privacy Policy at https://policies.google.com/privacy. For more
details and how to change this setting, see https://angular.dev/cli/analytics.

Yes

Thank you for sharing pseudonymous usage data. Should you change your mind, the following
command will disable this feature entirely:

ng analytics disable

Global setting: enabled
Local setting: enabled
Effective status: enabled
```
```diff
"cli": {
"packageManager": "npm",
+ "analytics": "67bf2f51-11c4-4627-bd27-414205f4d375"
},
```

> Running `npm run build` triggered the `Angular CLI` analytics prompt. Selecting `Yes` added the `analytics` property with a unique UUID to `angular.json`. This enables pseudonymous usage data collection locally for the project.

## 🧪 Tests

- [x] Verify `VSC` no longer shows `rootDir` warning in `tsconfig.app.json`
- [x] Verify `VSC` no longer shows `rootDir` warning in `tsconfig.spec.json`
- [x] Run build and verify it completes successfully:

```bash
npm run build
```
- [x] Run tests and verify they pass:

```bash
npm test
```

## 📌 Notes

- The `Angular` build uses `@angular/build:application` (esbuild-based), not `tsc` directly
- The `outDir` values (`./out-tsc/app` and `./out-tsc/spec`) are used by the `TypeScript` language service but not by the `Angular` builder
- Setting `rootDir` to `"./"` is the safest option as it covers all source paths under the project root

## 🔗 References

### Files to modify
- `angular.json`
- `tsconfig.app.json`
- `tsconfig.spec.json`

### Documentation
- https://www.typescriptlang.org/tsconfig#rootDir
- https://www.typescriptlang.org/tsconfig#outDir

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.