fix(@schematics/angular): regression tsconfig.json #16708 (#16709)

* fix(@schematics/angular): regression tsconfig.json

fix(@schematics/angular): regression tsconfig.json  …
Unverified
0e318ae
Regression in tsconfig.json set `"outDir": "./dist/out-tsc"` for problems in VSCode TS(2307) when building library referred in tsconfig "paths"

Closes: #16708

* fix(@schematics/angular): regression tsconfig.json

Improve paths in root tsconfig.json for better DX experience when using auto imports in IDE's.

Closes #16709

* fix(@schematics/angular): regression tsconfig.json

Improve paths in root tsconfig.json for better DX experience when using auto imports in IDE's.
Fix code lint.

Closes #16709

* fix(@schematics/angular): regression tsconfig.json

Improve paths in root tsconfig.json for better DX experience when using auto imports in IDE's.
Fix test code to conform new behaviour.

Closes #16709

(cherry picked from commit 3aacf41)

Author: dmorosinotto

packages/schematics/angular/library/index.ts

@@ -55,7 +55,7 @@ function updateJsonFile<T>(host: Tree, path: string, callback: UpdateJsonFn<T>):
   return host;
 }
 
-function updateTsConfig(packageName: string, distRoot: string) {
+function updateTsConfig(packageName: string, ...paths: string[]) {
 
   return (host: Tree) => {
     if (!host.exists('tsconfig.json')) { return host; }
@@ -67,7 +67,7 @@ function updateTsConfig(packageName: string, distRoot: string) {
       if (!tsconfig.compilerOptions.paths[packageName]) {
         tsconfig.compilerOptions.paths[packageName] = [];
       }
-      tsconfig.compilerOptions.paths[packageName].push(distRoot);
+      tsconfig.compilerOptions.paths[packageName].push(...paths);
     });
   };
 }
@@ -192,6 +192,7 @@ export default function (options: LibraryOptions): Rule {
     const folderName = `${scopeFolder}${strings.dasherize(options.name)}`;
     const projectRoot = join(normalize(newProjectRoot), folderName);
     const distRoot = `dist/${folderName}`;
+    const pathImportLib = `${distRoot}/${folderName.replace('/', '-')}`;
     const sourceDir = `${projectRoot}/src/lib`;
 
     const templateSource = apply(url('./files'), [
@@ -214,7 +215,7 @@ export default function (options: LibraryOptions): Rule {
       mergeWith(templateSource),
       addLibToWorkspaceFile(options, projectRoot, projectName),
       options.skipPackageJson ? noop() : addDependenciesToPackageJson(),
-      options.skipTsConfig ? noop() : updateTsConfig(packageName, distRoot),
+      options.skipTsConfig ? noop() : updateTsConfig(packageName, pathImportLib, distRoot),
       schematic('module', {
         name: options.name,
         commonModule: false,

packages/schematics/angular/library/index_spec.ts

@@ -206,8 +206,9 @@ describe('Library Schematic', () => {
 
       const tsConfigJson = getJsonFileContent(tree, 'tsconfig.json');
       expect(tsConfigJson.compilerOptions.paths.foo).toBeTruthy();
-      expect(tsConfigJson.compilerOptions.paths.foo.length).toEqual(1);
-      expect(tsConfigJson.compilerOptions.paths.foo[0]).toEqual('dist/foo');
+      expect(tsConfigJson.compilerOptions.paths.foo.length).toEqual(2);
+      expect(tsConfigJson.compilerOptions.paths.foo[0]).toEqual('dist/foo/foo');
+      expect(tsConfigJson.compilerOptions.paths.foo[1]).toEqual('dist/foo');
     });
 
     it(`should append to existing paths mappings`, async () => {
@@ -223,8 +224,9 @@ describe('Library Schematic', () => {
 
       const tsConfigJson = getJsonFileContent(tree, 'tsconfig.json');
       expect(tsConfigJson.compilerOptions.paths.foo).toBeTruthy();
-      expect(tsConfigJson.compilerOptions.paths.foo.length).toEqual(2);
-      expect(tsConfigJson.compilerOptions.paths.foo[1]).toEqual('dist/foo');
+      expect(tsConfigJson.compilerOptions.paths.foo.length).toEqual(3);
+      expect(tsConfigJson.compilerOptions.paths.foo[1]).toEqual('dist/foo/foo');
+      expect(tsConfigJson.compilerOptions.paths.foo[2]).toEqual('dist/foo');
     });
 
     it(`should not modify the file when --skipTsConfig`, async () => {
@@ -268,7 +270,7 @@ describe('Library Schematic', () => {
     expect(cfg.projects['@myscope/mylib']).toBeDefined();
 
     const rootTsCfg = JSON.parse(tree.readContent('/tsconfig.json'));
-    expect(rootTsCfg.compilerOptions.paths['@myscope/mylib']).toEqual(['dist/myscope/mylib']);
+    expect(rootTsCfg.compilerOptions.paths['@myscope/mylib']).toEqual(['dist/myscope/mylib/myscope-mylib', 'dist/myscope/mylib']);
 
     const karmaConf = getFileContent(tree, '/projects/myscope/mylib/karma.conf.js');
     expect(karmaConf).toContain(`dir: require('path').join(__dirname, '../../../coverage/myscope/mylib')`);

packages/schematics/angular/workspace/files/tsconfig.json.template

@@ -2,7 +2,7 @@
   "compileOnSave": false,
   "compilerOptions": {
     "baseUrl": "./",
-    "outDir": "./dist",<% if (strict) { %>
+    "outDir": "./dist/out-tsc",<% if (strict) { %>
     "noImplicitAny": true,
     "noImplicitReturns": true,
     "noImplicitThis": true,