feat(core): Nx 11 compatibility with new lib separation for xplat (#232)

nstudio · Dec 31, 2020 · 50f3a40 · 50f3a40
1 parent b5eaf15
commit 50f3a40
Show file tree

Hide file tree

Showing 272 changed files with 6,352 additions and 3,357 deletions.
diff --git a/.prettierignore b/.prettierignore
@@ -3,6 +3,7 @@ tmp
 /build
 node_modules
 /package.json
+packages/**/*.html
 packages/angular/src/schematics/**/_**files/**/*.json
 packages/electron/src/schematics/**/_**files/**/*.json
 packages/ionic/src/schematics/**/_**files/**/*.json
@@ -11,6 +12,7 @@ packages/nativescript/src/schematics/**/App_Resources/**/*
 packages/nativescript/src/schematics/**/hooks/**/*
 packages/nativescript/src/schematics/**/tools/**/*
 packages/nativescript/src/schematics/xplat/_files/scss/fonticons/*.css
+packages/nativescript-angular/src/schematics/application/_files/webpack.config.js
 packages/nativescript-angular/src/schematics/xplat/_files/scss/fonticons/*.css
 packages/web/src/schematics/**/_*/**/*.json
 packages/xplat/src/schematics/**/_*/**/*.json

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@nstudio/xplat-source",
-  "version": "10.3.9",
+  "version": "11.0.7",
   "description": "Cross-platform (xplat) tools for Nx workspaces.",
   "homepage": "https://nstudio.io/xplat",
   "private": true,
@@ -33,43 +33,40 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@angular-devkit/architect": "~0.1001.0",
-    "@angular-devkit/build-angular": "~0.1001.0",
-    "@angular-devkit/build-ng-packagr": "~0.1001.0",
-    "@angular-devkit/build-optimizer": "~0.1001.0",
-    "@angular-devkit/build-webpack": "~0.1001.0",
-    "@angular-devkit/core": "~10.1.0",
-    "@angular-devkit/schematics": "~10.1.0",
-    "@angular/cli": "~10.1.0",
-    "@angular/common": "~10.1.0",
-    "@angular/compiler": "~10.1.0",
-    "@angular/compiler-cli": "~10.1.0",
-    "@angular/core": "~10.1.0",
-    "@angular/forms": "~10.1.0",
-    "@angular/platform-browser": "~10.1.0",
-    "@angular/platform-browser-dynamic": "~10.1.0",
-    "@angular/router": "~10.1.0",
-    "@angular/service-worker": "~10.1.0",
-    "@angular/upgrade": "~10.1.0",
+    "@angular-devkit/architect": "~0.1100.1",
+    "@angular-devkit/build-angular": "~0.1100.1",
+    "@angular-devkit/build-optimizer": "~0.1100.1",
+    "@angular-devkit/build-webpack": "~0.1100.1",
+    "@angular-devkit/build-ng-packagr": "~0.1002.0",
+    "@angular-devkit/core": "~11.0.1",
+    "@angular-devkit/schematics": "~11.0.1",
+    "@angular/cli": "~11.0.1",
+    "@angular/common": "~11.0.0",
+    "@angular/compiler": "~11.0.0",
+    "@angular/compiler-cli": "~11.0.0",
+    "@angular/core": "~11.0.0",
+    "@angular/forms": "~11.0.0",
+    "@angular/platform-browser": "~11.0.0",
+    "@angular/platform-browser-dynamic": "~11.0.0",
+    "@angular/router": "~11.0.0",
+    "@angular/service-worker": "~11.0.0",
+    "@angular/upgrade": "~11.0.0",
     "@cypress/webpack-preprocessor": "^5.4.2",
-    "@nrwl/angular": "~10.3.0",
-    "@nrwl/express": "~10.3.0",
-    "@nrwl/nest": "~10.3.0",
-    "@nrwl/node": "~10.3.0",
-    "@nrwl/react": "~10.3.0",
-    "@nrwl/web": "~10.3.0",
-    "@nrwl/workspace": "~10.3.0",
-    "@schematics/angular": "~10.1.0",
+    "@nrwl/angular": "~11.0.0",
+    "@nrwl/express": "~11.0.0",
+    "@nrwl/nest": "~11.0.0",
+    "@nrwl/node": "~11.0.0",
+    "@nrwl/react": "~11.0.0",
+    "@nrwl/web": "~11.0.0",
+    "@nrwl/workspace": "~11.0.0",
+    "@schematics/angular": "~11.0.0",
     "@types/express": "~4.17.0",
     "@types/jasmine": "~3.5.11",
     "@types/jasminewd2": "~2.0.3",
     "@types/jest": "~26.0.7",
     "@types/node": "~12.0.0",
     "@types/prettier": "~2.0.2",
-    "@types/react": "~16.9.43",
-    "@types/react-dom": "~16.9.4",
-    "@types/react-router-dom": "~5.1.3",
-    "@types/webpack": "~4.41.21",
+    "@types/webpack": "^4.4.24",
     "@types/xml2js": "^0.4.5",
     "@types/yargs": "~15.0.5",
     "app-root-path": "~3.0.0",
@@ -97,9 +94,8 @@
     "jasmine-core": "~3.6.0",
     "jasmine-marbles": "~0.6.0",
     "jasmine-spec-reporter": "~5.0.2",
-    "jest": "~26.1.0",
-    "jest-jasmine2": "~26.1.0",
-    "jest-preset-angular": "~8.2.1",
+    "jest": "26.2.2",
+    "jest-preset-angular": "8.2.1",
     "jest-worker": "~26.1.0",
     "karma": "~5.1.1",
     "karma-chrome-launcher": "~3.1.0",
@@ -108,11 +104,12 @@
     "karma-jasmine-html-reporter": "~1.5.4",
     "karma-webpack": "~4.0.2",
     "license-webpack-plugin": "~2.3.0",
-    "ng-packagr": "~10.1.0",
+    "ng-packagr": "~11.0.0",
     "npm-run-all": "~4.1.5",
     "open": "~6.0.0",
     "precise-commits": "~1.0.2",
     "prettier": "~2.0.0",
+    "pretty-quick": "^2.0.1",
     "release-it": "~13.6.6",
     "rxjs": "~6.6.0",
     "semver": "~7.3.0",
@@ -127,8 +124,8 @@
     "tsickle": "~0.38.1",
     "tslib": "~2.0.0",
     "tslint": "~6.1.2",
-    "typescript": "~3.9.0",
-    "verdaccio": "~4.8.0",
+    "typescript": "~4.0.0",
+    "verdaccio": "~4.10.0",
     "webpack": "~4.44.0",
     "webpack-dev-middleware": "~3.7.0",
     "webpack-dev-server": "~3.11.0",
@@ -138,8 +135,8 @@
     "webpack-subresource-integrity": "~1.4.1",
     "worker-plugin": "~4.0.3",
     "xml2js": "~0.4.23",
-    "yargs": "~15.4.0",
-    "yargs-parser": "~18.1.3",
+    "yargs": "15.4.1",
+    "yargs-parser": "20.0.0",
     "zone.js": "~0.11.1"
   },
   "jest": {
@@ -166,7 +163,7 @@
   },
   "husky": {
     "hooks": {
-      "pre-push": "yarn checkcommit && yarn documentation && yarn checkformat"
+      "pre-push": "yarn checkcommit && pretty-quick --check"
     }
   }
 }
diff --git a/packages/angular/package.json b/packages/angular/package.json
@@ -29,7 +29,7 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@nrwl/angular": "^10.3.0"
+    "@nrwl/angular": "^11.0.0"
   },
   "peerDependencies": {
     "@nstudio/xplat": "*"

diff --git a/packages/angular/src/schematics/application/_files/src/app/core/core.module.ts__tmpl__ b/packages/angular/src/schematics/application/_files/src/app/core/core.module.ts__tmpl__
@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 
 // xplat
-import { <%= utils.classify(prefix) %>CoreModule } from '@<%= npmScope %>/<%= xplatFolderName %>';
+import { <%= utils.classify(prefix) %>CoreModule } from '@<%= npmScope %>/xplat/<%= xplatFolderName %>/core';
 
 @NgModule({
   imports: [<%= utils.classify(prefix) %>CoreModule]

diff --git a/...ngular/src/schematics/application/_files/src/app/features/shared/shared.module.ts__tmpl__ b/...ngular/src/schematics/application/_files/src/app/features/shared/shared.module.ts__tmpl__
@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 
 // xplat
-import { UIModule } from '@<%= npmScope %>/<%= xplatFolderName %>';
+import { UIModule } from '@<%= npmScope %>/xplat/<%= xplatFolderName %>/features';
 
 const MODULES = [UIModule];
 

diff --git a/...ics/application/_routing_files/src/app/features/home/components/home.component.ts__tmpl__ b/...ics/application/_routing_files/src/app/features/home/components/home.component.ts__tmpl__
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 
-import { BaseComponent } from '@<%= npmScope %>/core';
+import { BaseComponent } from '@<%= npmScope %>/xplat/core';
 
 @Component({
   selector: '<%= prefix %>-home',

diff --git a/packages/angular/src/schematics/application/index.spec.ts b/packages/angular/src/schematics/application/index.spec.ts
@@ -35,14 +35,13 @@ describe('app', () => {
 
     expect(tree.exists('/package.json')).toBeTruthy();
 
-    let checkFile = getFileContent(tree, '/package.json');
-    // console.log(checkFile);
-    const packageData: any = jsonParse(checkFile);
-    expect(packageData.scripts['start.web.foo']).toBeDefined();
-
     // should gen xplat structure by default
-    expect(tree.exists('/xplat/web/index.ts')).toBeTruthy();
-    expect(tree.exists('/xplat/web/core/index.ts')).toBeTruthy();
+    expect(tree.exists('/libs/xplat/web/core/src/lib/index.ts')).toBeTruthy();
+    expect(
+      tree.exists('/libs/xplat/web/features/src/lib/index.ts')
+    ).toBeTruthy();
+    expect(tree.exists('/libs/xplat/web/scss/src/_index.scss')).toBeTruthy();
+    expect(tree.exists('/libs/xplat/web/scss/src/package.json')).toBeTruthy();
   });
 
   it('should create all files for web app using groupByName', async () => {
@@ -59,7 +58,7 @@ describe('app', () => {
     let checkFile = getFileContent(tree, checkPath);
     // console.log('tsconfig.base:', checkFile);
     expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
-    expect(files.indexOf('/tsconfig.json')).toBeGreaterThanOrEqual(0);
+    expect(files.indexOf('/tsconfig.base.json')).toBeGreaterThanOrEqual(0);
     expect(files.indexOf('/apps/foo-web/src/main.ts')).toBeGreaterThanOrEqual(
       0
     );
@@ -72,11 +71,6 @@ describe('app', () => {
 
     checkPath = '/package.json';
     expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
-
-    checkFile = getFileContent(tree, checkPath);
-    // console.log(checkFile);
-    const packageData: any = jsonParse(checkFile);
-    expect(packageData.scripts['start.foo.web']).toBeDefined();
   });
 
   it('should create all files for web app in directory', async () => {
@@ -136,9 +130,6 @@ describe('app', () => {
     expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
 
     let checkFile = getFileContent(tree, checkPath);
-    // console.log(checkFile);
-    const packageData: any = jsonParse(checkFile);
-    expect(packageData.scripts['start.web.foo']).toBeDefined();
 
     checkPath = '/angular.json';
     expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
@@ -164,10 +155,6 @@ describe('app', () => {
   //   const checkPath = '/package.json';
   //   expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
 
-  //   let checkFile = getFileContent(tree, checkPath);
-  //   // console.log(checkFile);
-  //   const packageData: any = jsonParse(checkFile);
-  //   expect(packageData.scripts['start.ionic.foo']).toBeDefined();
   // });
 
   // it('should create app with --framework flag for NativeScript', async () => {
@@ -184,10 +171,6 @@ describe('app', () => {
   //   const checkPath = '/package.json';
   //   expect(files.indexOf(checkPath)).toBeGreaterThanOrEqual(0);
 
-  //   let checkFile = getFileContent(tree, checkPath);
-  //   // console.log(checkFile);
-  //   const packageData: any = jsonParse(checkFile);
-  //   expect(packageData.scripts['start.nativescript.foo.ios']).toBeDefined();
   // });
 
   describe('useXplat false', () => {
@@ -204,7 +187,7 @@ describe('app', () => {
       expect(
         tree.exists('/apps/web-foo/src/app/core/core.module.ts')
       ).toBeFalsy();
-      expect(tree.exists('/xplat/web/index.ts')).toBeFalsy();
+      expect(tree.exists('/libs/xplat/web/src/lib/index.ts')).toBeFalsy();
     });
   });
 });
diff --git a/packages/angular/src/schematics/application/index.ts b/packages/angular/src/schematics/application/index.ts
@@ -31,7 +31,6 @@ import {
   getJsonFromFile,
   updateJsonFile,
   supportedPlatforms,
-  checkRootTsConfig,
 } from '@nstudio/xplat-utils';
 import { Schema } from './schema';
 
@@ -103,14 +102,8 @@ export default function (options: Schema) {
       scripts[
         `clean`
       ] = `npx rimraf hooks node_modules package-lock.json && npm i`;
-      scripts[`start.${platformApp}`] = `nx serve ${options.name}`;
       return updatePackageScripts(tree, scripts);
     },
-    (tree: Tree) => {
-      // make sure tsconfig exists at root
-      // we do this here because Nrwl with 10.1 was actually removing it
-      checkRootTsConfig(tree);
-    },
     <any>formatFiles({ skipFormat: options.skipFormat }),
   ]);
 }
@@ -235,10 +228,10 @@ function adjustAppFiles(options: Schema, tree: Tree): Rule {
         workspaceConfig.projects[
           options.name
         ].architect.build.options.styles = [
-          `xplat/${XplatHelpers.getXplatFoldername(
+          `libs/xplat/${XplatHelpers.getXplatFoldername(
             'web',
             'angular'
-          )}/scss/_index.scss`,
+          )}/scss/src/_index.scss`,
           `apps/${directory}${options.name}/src/styles.scss`,
         ];
       }
@@ -269,7 +262,7 @@ function mainContent() {
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 // libs
-import { environment } from '@${getNpmScope()}/core';
+import { environment } from '@${getNpmScope()}/xplat/core';
 
 // app
 import { AppModule } from './app/app.module';
@@ -308,10 +301,10 @@ function appCmpContent() {
   return `import { Component } from '@angular/core';
 
 // xplat
-import { AppBaseComponent } from '@${getNpmScope()}/${XplatHelpers.getXplatFoldername(
+import { AppBaseComponent } from '@${getNpmScope()}/xplat/${XplatHelpers.getXplatFoldername(
     'web',
     'angular'
-  )}';
+  )}/core';
 
 @Component({
     selector: '${getPrefix()}-root',
@@ -412,7 +405,7 @@ function appModuleContent(options) {
   return `import { NgModule } from '@angular/core';
 
 // libs
-import { environment } from '@${getNpmScope()}/core';
+import { environment } from '@${getNpmScope()}/xplat/core';
 
 // app
 import { CoreModule } from './core/core.module';

diff --git a/packages/angular/src/schematics/component/_base_files/__name__.base-component.ts__tmpl__ b/packages/angular/src/schematics/component/_base_files/__name__.base-component.ts__tmpl__
@@ -1,5 +1,5 @@
 import { Directive } from '@angular/core';
-import { BaseComponent } from '@<%= npmScope %>/core';
+import { BaseComponent } from '@<%= npmScope %>/xplat/core';
 
 @Directive()
 export abstract class <%= utils.classify(name) %>BaseComponent extends BaseComponent {