fix issues in cli for Angular

Author: GoodDayForSurf

packages/devextreme-cli/src/utility/ng-version.js

@@ -2,12 +2,12 @@ const semver = require('semver').SemVer;
 const execSync = require('child_process').execSync;
 
 function parseNgCliVersion(stdout) {
-    return /angular.cli:\s*(\S+)/ig.exec(stdout)[1];
+    return stdout.trim();
 }
 
 const getLocalNgVersion = () => {
     try {
-        const version = parseNgCliVersion(execSync('ng v').toString());
+        const version = parseNgCliVersion(execSync('ng --version').toString());
         return new semver(version);
     } catch(e) {
         return '';

packages/devextreme-schematics/src/add-layout/files/src/app/app-navigation.ts

@@ -1 +1 @@
-export const navigation = [];
+export const navigation: { path?: string, text: string, icon: string, items?: any[] }[] = [];

packages/devextreme-schematics/src/add-layout/index.ts

@@ -44,7 +44,8 @@ import {
 
 import {
   NodeDependencyType,
-  addPackageJsonDependency
+  addPackageJsonDependency,
+  getPackageJsonDependency,
 } from '@schematics/angular/utility/dependencies';
 
 import { getSourceFile } from '../utility/source';
@@ -173,6 +174,28 @@ async function updateBudgets(host: Tree, options: any) {
   return host;
 }
 
+async function addPolyfills(host: Tree, project: string, polyfills: string[]) {
+  const projectName = await getProjectName(host, project);
+
+  modifyJSONFile(host, './angular.json', config => {
+    const buildOptions: Record<string, any> = config.projects[projectName]['architect']['build']['options'];
+
+    if (!buildOptions.polyfills) {
+      buildOptions.polyfills = [];
+    }
+
+    polyfills.forEach((polyfill) => {
+      if (!buildOptions.polyfills.includes(polyfill)) {
+        buildOptions.polyfills.push(polyfill);
+      }
+    })
+
+    return config;
+  });
+
+  return host;
+}
+
 function addViewportToBody(sourcePath: string = '') {
   return (host: Tree) => {
     const indexPath =  join(sourcePath, 'index.html');
@@ -200,7 +223,7 @@ function modifyFileRule(path: string, callback: (source: SourceFile) => Change[]
 }
 
 function updateAppComponent(host: Tree, sourcePath: string, templateOptions: any = {}) {
-  const appMComponentPath = sourcePath + (isAngularVersionHigherThan(host, 20) ? 'app.ts' : 'app.component.ts');
+  const appMComponentPath = sourcePath + templateOptions.name + '.ts';
 
   const importSetter = (importName: string, path: string, alias: string) => {
     return (source: SourceFile) => {
@@ -250,13 +273,25 @@ function hasRouting(host: Tree, sourcePath: string) {
 
 function addPackagesToDependency(globalNgCliVersion: string) {
   const version = new SemVer(globalNgCliVersion.replace(/\^|\~/g, ''));
+
   return (host: Tree) => {
+    const zonejs = getPackageJsonDependency(host, 'zone.js');
+
     addPackageJsonDependency(host, {
       type: NodeDependencyType.Default,
       name: '@angular/cdk',
-      version: `~${version.major}.${version.minor}.0`
+      version: version.raw.includes('next') || version.raw.includes('-rc')
+        ? 'next' : `^${version.major}.${version.minor > 1 ? version.minor - 1 : 0}.0`
     });
 
+    if (!zonejs) {
+      addPackageJsonDependency(host, {
+        type: NodeDependencyType.Default,
+        name: 'zone.js',
+        version: version.major > 18 ? '~0.15.0' : '~0.14.0'
+      });
+    }
+
     return host;
   };
 }
@@ -393,7 +428,8 @@ export default function(options: any): Rule {
       addBuildThemeScript(),
       () => addCustomThemeStyles(host, options, sourcePath) as any,
       addViewportToBody(sourcePath),
-      addPackagesToDependency(options.globalNgCliVersion)
+      addPackagesToDependency(options.globalNgCliVersion),
+      () => addPolyfills(host, options.project, ['zone.js'])
     ];
 
     if (options.updateBudgets) {

packages/devextreme-schematics/src/utility/change.ts

@@ -36,14 +36,19 @@ export function insertItemToArray(
 
   const nodeContent = node.getText();
   const nodePosition = node.getStart();
-  const leftBracketPosition = nodePosition + nodeContent.indexOf('[');
+  const leftBracketPosition = nodePosition + nodeContent.indexOf('[', nodeContent.indexOf('=') || 0);
   const rightBracketPosition = nodePosition + nodeContent.lastIndexOf(']');
   let itemPosition = leftBracketPosition + 1;
   let fileRecorder = host.beginUpdate(filePath);
 
   item = newLine + item;
 
-  const isNodeEmpty = !/\[[\s\S]*\S+[\s\S]*\]/m.test(nodeContent);
+  const isNodeEmpty =!(
+    nodeContent.includes('=')
+      ? /=\s*\[[\s\S]*\S+[\s\S]*\]/m
+      : /\[[\s\S]*\S+[\s\S]*\]/m
+    ).test(nodeContent);
+
   if (isNodeEmpty) {
     const formattedArray = `[${newLine}]`;
     fileRecorder.remove(leftBracketPosition, rightBracketPosition - leftBracketPosition + 1);