Skip to content

Commit 2344d0b

Browse files
mhartingtonmhartington
authored
feat(angular): angular 9 support (ionic-team#19515)
* init ivy support * chore(): angular prerelease * chore: update * updates * angular 8 deps * chore(angular): update sync script * updates * chore(): remove console log * chore(): updates * chore(): update release script * fix(): remove comments * fix(): remove test version * fix(): failing angular test * fix(): failing angular tests * fix(): update ci steps * fix(): fix sync script * chore(): refactor angular proxies * chore(): updates * chore(): updates * chore(): lint * chore(): updates * chore(ssr): check for window * chore(): fix virtual scroll angular tests * chore(): lint * chore(): add server to link * chore(scripts): update release script * chore(): bump version check * style(scripts): spacing
1 parent 49c394c commit 2344d0b

35 files changed

Lines changed: 509 additions & 367 deletions

‎.circleci/config.yml‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -310,9 +310,6 @@ jobs:
310310
- run:
311311
command: npm install
312312
working_directory: /tmp/workspace/angular/test/test-app
313-
- run:
314-
command: npm run sync
315-
working_directory: /tmp/workspace/angular/test/test-app
316313
- run:
317314
command: npm test
318315
working_directory: /tmp/workspace/angular/test/test-app

‎.scripts/common.js‎

Lines changed: 24 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@ const packages = [
1313
'docs',
1414
'angular',
1515
'packages/react',
16-
'packages/react-router'
16+
'packages/react-router',
17+
'packages/angular-server'
1718
];
1819

1920
function readPkg(project) {
@@ -151,6 +152,7 @@ function preparePackage(tasks, package, version, install) {
151152
}
152153
}
153154

155+
// Lint, Test, Bump Core dependency
154156
if (version) {
155157
projectTasks.push({
156158
title: `${pkg.name}: lint`,
@@ -160,12 +162,22 @@ function preparePackage(tasks, package, version, install) {
160162
title: `${pkg.name}: test`,
161163
task: async () => await execa('npm', ['test'], { cwd: projectRoot })
162164
});
165+
projectTasks.push({
166+
title: `${pkg.name}: update ionic/core dep to ${version}`,
167+
task: () => {
168+
updateDependency(pkg, '@ionic/core', version);
169+
writePkg(package, pkg);
170+
}
171+
});
163172
}
164173

174+
// Build
165175
projectTasks.push({
166176
title: `${pkg.name}: build`,
167177
task: () => execa('npm', ['run', 'build'], { cwd: projectRoot })
168178
});
179+
180+
// Link core or react for sub projects
169181
if (package === 'core' || package === 'packages/react') {
170182
projectTasks.push({
171183
title: `${pkg.name}: npm link`,
@@ -236,7 +248,6 @@ function prepareDevPackage(tasks, package, version) {
236248
function updatePackageVersions(tasks, packages, version) {
237249
packages.forEach(package => {
238250
updatePackageVersion(tasks, package, version);
239-
240251
tasks.push({
241252
title: `${package} update @ionic/core dependency, if present ${tc.dim(`(${version})`)}`,
242253
task: async () => {
@@ -261,7 +272,11 @@ function updatePackageVersions(tasks, packages, version) {
261272
}
262273

263274
function updatePackageVersion(tasks, package, version) {
264-
const projectRoot = projectPath(package);
275+
let projectRoot = projectPath(package);
276+
277+
if (package === 'packages/angular-server' || package === 'angular') {
278+
projectRoot = path.join(projectPath, 'dist')
279+
}
265280

266281
tasks.push({
267282
title: `${package}: update package.json ${tc.dim(`(${version})`)}`,
@@ -290,9 +305,13 @@ function publishPackages(tasks, packages, version, tag = 'latest') {
290305
});
291306
});
292307

293-
// next publish
308+
// Publish
294309
packages.forEach(package => {
295-
const projectRoot = projectPath(package);
310+
let projectRoot = projectPath(package);
311+
312+
if (package === 'packages/angular-server' || package === 'angular') {
313+
projectRoot = path.join(projectRoot, 'dist')
314+
}
296315

297316
tasks.push({
298317
title: `${package}: publish to ${tag} tag`,

‎angular/package.json‎

Lines changed: 26 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -24,11 +24,11 @@
2424
},
2525
"homepage": "https://ionicframework.com/",
2626
"scripts": {
27-
"build": "npm run clean && npm run build.core && npm run build.ng && npm run clean-generated",
27+
"build": "npm run clean && npm run build.ng && npm run build.core && npm run clean-generated",
2828
"build.core": "node scripts/build-core.js",
2929
"build.fesm": "rollup --config ./scripts/rollup.config.js",
3030
"build.link": "npm run build && node scripts/link-copy.js",
31-
"build.ng": "npm run build.es2015 && npm run build.es5",
31+
"build.ng": "ng-packagr -p package.json",
3232
"build.es2015": "ngc -p tsconfig.json && rollup --config ./scripts/rollup.config.js",
3333
"build.es5": "ngc -p tsconfig.legacy.json && rollup --config ./scripts/rollup.config.legacy.js",
3434
"clean": "node scripts/clean.js",
@@ -41,53 +41,46 @@
4141
"tsc": "tsc -p .",
4242
"validate": "npm i && npm run lint && npm run test && npm run build"
4343
},
44-
"module": "dist/fesm5.js",
45-
"main": "dist/fesm5.cjs.js",
46-
"types": "dist/core.d.ts",
47-
"files": [
48-
"dist/",
49-
"css/"
50-
],
5144
"dependencies": {
5245
"@ionic/core": "5.0.0-beta.2",
5346
"tslib": "^1.9.3"
5447
},
5548
"peerDependencies": {
56-
"@angular-devkit/core": "7.2.1 - 8",
57-
"@angular-devkit/schematics": "7.2.1 - 8",
58-
"@angular/core": "7.2.1 - 8",
59-
"@angular/common": "7.2.1 - 8",
60-
"@angular/forms": "7.2.1 - 8",
61-
"@angular/router": "7.2.1 - 8",
62-
"@angular/compiler": "7.2.1 - 8",
63-
"@angular/compiler-cli": "7.2.1 - 8",
64-
"@angular/platform-browser": "7.2.1 - 8",
65-
"@angular/platform-browser-dynamic": "7.2.1 - 8",
49+
"@angular/core": ">=8.2.7",
50+
"@angular/forms": ">=8.2.7",
51+
"@angular/router": ">=8.2.7",
6652
"rxjs": ">=6.2.0",
6753
"zone.js": ">=0.8.26"
6854
},
6955
"devDependencies": {
70-
"@angular-devkit/core": "^7.2.1",
71-
"@angular-devkit/schematics": "^7.2.1",
72-
"@angular/common": "^7.2.1",
73-
"@angular/compiler": "^7.2.1",
74-
"@angular/compiler-cli": "^7.2.1",
75-
"@angular/core": "^7.2.1",
76-
"@angular/forms": "^7.2.1",
77-
"@angular/platform-browser": "^7.2.1",
78-
"@angular/platform-browser-dynamic": "^7.2.1",
79-
"@angular/router": "^7.2.1",
80-
"@types/node": "~12.0.12",
56+
"@angular-devkit/core": "8.3.17",
57+
"@angular-devkit/schematics": "8.3.17",
58+
"@angular/common": "8.2.13",
59+
"@angular/compiler": "8.2.13",
60+
"@angular/compiler-cli": "8.2.13",
61+
"@angular/core": "8.2.13",
62+
"@angular/forms": "8.2.13",
63+
"@angular/router": "8.2.13",
64+
"@types/node": "12.12.5",
8165
"fs-extra": "^7.0.0",
8266
"glob": "^7.1.4",
67+
"ng-packagr": "5.7.1",
8368
"rollup": "~1.17.0",
8469
"rollup-plugin-node-resolve": "~5.2.0",
8570
"rxjs": "^6.5.2",
8671
"tsickle": "^0.34.0",
8772
"tslint": "^5.12.1",
8873
"tslint-ionic-rules": "0.0.21",
89-
"typescript": "~3.2.2",
90-
"zone.js": "~0.8.26"
74+
"typescript": "3.4.5",
75+
"zone.js": "^0.8.28"
9176
},
92-
"schematics": "./dist/schematics/collection.json"
77+
"schematics": "schematics/collection.json",
78+
"ngPackage": {
79+
"lib": {
80+
"entryFile": "src/index.ts"
81+
},
82+
"whitelistedNonPeerDependencies": [
83+
"@ionic/core"
84+
]
85+
}
9386
}

‎angular/scripts/build-core.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ function copyIonicons() {
1515

1616
function copyCSS() {
1717
const src = path.join(__dirname, '..', '..', 'core', 'css');
18-
const dst = path.join(__dirname, '..', 'css');
18+
const dst = path.join(__dirname, '..','dist', 'css');
1919

2020
fs.removeSync(dst);
2121
fs.copySync(src, dst);

‎angular/scripts/rollup.config.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export default {
1616
},
1717
plugins: [
1818
resolve({
19-
module: true,
19+
mainFields: ['module']
2020
})
2121
]
22-
};
22+
};

‎angular/src/app-initialize.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ let didInitialize = false;
1010
export const appInitialize = (config: Config, doc: Document, zone: NgZone) => {
1111
return (): any => {
1212
const win: IonicWindow | undefined = doc.defaultView as any;
13-
if (win) {
13+
if (win && typeof (window as any) !== 'undefined') {
1414
if (didInitialize) {
1515
console.warn('Ionic Angular was already initialized. Make sure IonicModule.forRoot() is just called once.');
1616
}

‎angular/src/directives/navigation/ion-back-button.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { IonRouterOutlet } from './ion-router-outlet';
66

77
@Directive({
88
selector: 'ion-back-button',
9-
inputs: ['defaultHref']
9+
inputs: ['defaultHref'],
1010
})
1111
export class IonBackButtonDelegate {
1212

‎angular/src/directives/navigation/ion-tabs.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -42,15 +42,15 @@ import { StackEvent } from './stack-utils';
4242
})
4343
export class IonTabs {
4444

45-
@ViewChild('outlet', { read: IonRouterOutlet }) outlet: IonRouterOutlet;
46-
@ContentChild(IonTabBar) tabBar: IonTabBar | undefined;
45+
@ViewChild('outlet', { read: IonRouterOutlet, static: false }) outlet: IonRouterOutlet;
46+
@ContentChild(IonTabBar, { static: false }) tabBar: IonTabBar | undefined;
4747

48-
@Output() ionTabsWillChange = new EventEmitter<{tab: string}>();
49-
@Output() ionTabsDidChange = new EventEmitter<{tab: string}>();
48+
@Output() ionTabsWillChange = new EventEmitter<{ tab: string }>();
49+
@Output() ionTabsDidChange = new EventEmitter<{ tab: string }>();
5050

5151
constructor(
5252
private navCtrl: NavController,
53-
) {}
53+
) { }
5454

5555
/**
5656
* @internal

‎angular/src/directives/navigation/nav-delegate.ts‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,26 @@
11
import { ComponentFactoryResolver, Directive, ElementRef, Injector, ViewContainerRef } from '@angular/core';
22

33
import { AngularDelegate } from '../../providers/angular-delegate';
4+
import { ProxyCmp, proxyOutputs } from '../proxies-utils';
45

6+
@ProxyCmp({
7+
inputs: ['animated', 'animation', 'root', 'rootParams', 'swipeGesture'],
8+
methods: ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'getActive', 'getByIndex', 'canGoBack', 'getPrevious']
9+
})
510
@Directive({
6-
selector: 'ion-nav',
11+
selector: 'ion-nav'
712
})
813
export class NavDelegate {
14+
protected el: HTMLElement;
915
constructor(
1016
ref: ElementRef,
1117
resolver: ComponentFactoryResolver,
1218
injector: Injector,
1319
angularDelegate: AngularDelegate,
1420
location: ViewContainerRef
1521
) {
22+
this.el = ref.nativeElement;
1623
ref.nativeElement.delegate = angularDelegate.create(resolver, injector, location);
24+
proxyOutputs(this, this.el, ['ionNavDidChange' , 'ionNavWillChange' ]);
1725
}
1826
}

‎angular/src/directives/proxies-utils.ts‎

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,24 +5,42 @@ export const proxyInputs = (Cmp: any, inputs: string[]) => {
55
const Prototype = Cmp.prototype;
66
inputs.forEach(item => {
77
Object.defineProperty(Prototype, item, {
8-
get() { return this.el[item]; },
9-
set(val: any) {
10-
this.z.runOutsideAngular(() => this.el[item] = val);
8+
get() {
9+
return this.el[item];
1110
},
11+
set(val: any) {
12+
this.z.runOutsideAngular(() => (this.el[item] = val));
13+
}
1214
});
1315
});
1416
};
1517

1618
export const proxyMethods = (Cmp: any, methods: string[]) => {
1719
const Prototype = Cmp.prototype;
1820
methods.forEach(methodName => {
19-
Prototype[methodName] = function() {
21+
Prototype[methodName] = function () {
2022
const args = arguments;
21-
return this.z.runOutsideAngular(() => this.el[methodName].apply(this.el, args));
23+
return this.z.runOutsideAngular(() =>
24+
this.el[methodName].apply(this.el, args)
25+
);
2226
};
2327
});
2428
};
2529

2630
export const proxyOutputs = (instance: any, el: any, events: string[]) => {
2731
events.forEach(eventName => instance[eventName] = fromEvent(el, eventName));
28-
};
32+
}
33+
34+
// tslint:disable-next-line: only-arrow-functions
35+
export function ProxyCmp(opts: { inputs?: any; methods?: any }) {
36+
const decorator = function(cls: any){
37+
if (opts.inputs) {
38+
proxyInputs(cls, opts.inputs);
39+
}
40+
if (opts.methods) {
41+
proxyMethods(cls, opts.methods);
42+
}
43+
return cls;
44+
};
45+
return decorator;
46+
}

0 commit comments

Comments
 (0)