refactor(ng-add): inserted version should align with other Angular dependencies. (#13704)

In favor of consistency, the versions that will be inserted when running `ng-add`, should be aligned with the default Angular dependencies in a new CLI project.

This means that we should not provide the version with a leading caret because that means that NPM can automatically/ and magically update to the most recent minor version. This shouldn't cause any problems but is just not in sync with other Angular dependencies.

All other Angular dependencies (e.g. `@angular/core') will be installed with a leading tilde. This means that it can only happen that NPM automatically updates to the most recent patch release. We should do the same in order to be consistent.

Author: devversion

src/cdk/schematics/ng-add/index.ts

@@ -15,12 +15,16 @@ export const cdkVersion = loadPackageVersionGracefully('@angular/cdk');
 /**
  * Schematic factory entry-point for the `ng-add` schematic. The ng-add schematic will be
  * automatically executed if developers run `ng add @angular/cdk`.
+ *
+ * By default, the CLI already installs the package that has been specified with `ng add`.
+ * We just store the version in the `package.json` in case the package manager didn't. Also
+ * this ensures that there will be no error that says that the CDK does not support `ng add`.
  */
 export default function(): Rule {
   return (host: Tree) => {
-    // By default, the CLI already installs the package that has been installed through `ng add`.
-    // We just store the version in the `package.json` in case the package manager didn't.
-    addPackageToPackageJson(host, '@angular/cdk', `^${cdkVersion}`);
+    // In order to align the CDK version with the other Angular dependencies, we use tilde
+    // instead of caret. This is default for Angular dependencies in new CLI projects.
+    addPackageToPackageJson(host, '@angular/cdk', `~${cdkVersion}`);
   };
 }
 

src/lib/schematics/ng-add/index.ts

@@ -26,8 +26,10 @@ export default function(options: Schema): Rule {
     // have the same version tag if possible.
     const ngCoreVersionTag = getPackageVersionFromPackageJson(host, '@angular/core');
 
-    addPackageToPackageJson(host, '@angular/cdk', `^${materialVersion}`);
-    addPackageToPackageJson(host, '@angular/material', `^${materialVersion}`);
+    // In order to align the Material and CDK version with the other Angular dependencies,
+    // we use tilde instead of caret. This is default for Angular dependencies in new CLI projects.
+    addPackageToPackageJson(host, '@angular/cdk', `~${materialVersion}`);
+    addPackageToPackageJson(host, '@angular/material', `~${materialVersion}`);
     addPackageToPackageJson(host, '@angular/animations',
         ngCoreVersionTag || requiredAngularVersionRange);