chore(): update angular build scripts

angular/package.json

@@ -20,11 +20,12 @@
     "url": "https://github.com/ionic-team/ionic.git"
   },
   "scripts": {
-    "build": "npm run clean && npm run compile && npm run clean-generated",
+    "build": "npm run clean && npm run compile && npm run clean-generated && npm run ionic-core",
     "build.link": "npm run build && node scripts/link-copy.js",
     "clean": "node scripts/clean.js",
     "clean-generated": "node ./scripts/clean-generated.js",
     "compile": "./node_modules/.bin/ngc",
+    "ionic-core": "stencil build --dev",
     "lint": "tslint --project .",
     "tsc": "tsc -p ."
   },
@@ -34,6 +35,7 @@
     "dist/"
   ],
   "devDependencies": {
+    "@angular/animations": "latest",
     "@angular/common": "latest",
     "@angular/compiler": "latest",
     "@angular/compiler-cli": "latest",
@@ -43,19 +45,19 @@
     "@angular/platform-browser": "latest",
     "@angular/platform-browser-dynamic": "latest",
     "@angular/router": "latest",
-    "@ionic/core": "latest",
+    "@ionic/core": "^0.1.4",
+    "@stencil/core": "^0.7.8",
     "chalk": "^2.3.2",
     "execa": "^0.9.0",
     "fs-extra": "^5.0.0",
     "glob": "7.1.2",
     "inquirer": "^5.1.0",
     "listr": "^0.13.0",
-    "rimraf": "^2.6.2",
-    "rxjs": "5.5.2",
+    "rxjs": "^5.5.2",
     "semver": "^5.5.0",
     "tslint": "^5.8.0",
     "tslint-ionic-rules": "0.0.13",
     "typescript": "^2.6.2",
-    "zone.js": "0.8.18"
+    "zone.js": "^0.8.18"
   }
 }

angular/scripts/README.md

@@ -1,3 +1,15 @@
+# Local @ionic/angular test app development
+
+1. `npm install` at the root of `angular`
+2. `npm run build` to build local `@ionic/angular`
+3. `npm link` to locally link `@ionic/angular`
+4. `cd` to the test app, such as `angular/test/nav`
+5. `npm install` in the test app directory
+6. `npm link @ionic/angular` in the test app directory
+7. `ng serve` in the test app directory
+8. [http://localhost:4200/](http://localhost:4200/)
+
+
 # npm link local development
 
 `npm link` doesn't work as expected due to the `devDependency` on `@angular/core`. This is the work around...
@@ -5,12 +17,3 @@
     npm run build.link ../ionic-conference-app
 
 When the command above is ran from the `angular` directory, it will build `@ionic/angular` and copy the `dist` directory to the correct location of another local project. In the example above, the end result is that it copies the `dist` directory to `../ionic-conference-app/node_modules/@ionic/angular/dist`. The path given should be relative to the root of this mono repo.
-
-
-# Deploy
-
-1. `npm run prepare.deploy`
-2. Review/update changelog
-3. Commit updates using the package name and version number as the commit message.
-4. `npm run deploy`
-5. :tada:

angular/scripts/clean-generated.js

@@ -2,23 +2,12 @@ const path = require('path');
 const cwd = process.cwd();
 
 const glob = require('glob');
-const rimRaf = require('rimraf');
+const fs = require('fs-extra');
 
-const distDir = path.join(cwd, 'dist');
+const distDir = path.join(__dirname, '../dist');
 
 const distGeneratedNodeModules = path.join(distDir, 'node_modules');
 
-function rimRafAsync(dir) {
-  return new Promise((resolve, reject) => {
-    rimRaf(dir, {}, err => {
-      if (err) {
-        return reject(err);
-      }
-      resolve();
-    })
-  });
-}
-
 function doGlob(globString) {
   return new Promise((resolve, reject) => {
     glob(globString, (err, matches) => {
@@ -40,15 +29,14 @@ function getCodegenedFilesToDelete() {
     const deleteFilePromises = [];
     listOfGlobResults.forEach(fileMatches => {
       fileMatches.forEach(filePath => {
-        deleteFilePromises.push(rimRafAsync(filePath));
+        deleteFilePromises.push(fs.remove(filePath));
       })
     })
     return Promise.all(deleteFilePromises);
   });
 }
 
-const taskPromises = [];
-taskPromises.push(getCodegenedFilesToDelete());
-taskPromises.push(rimRafAsync(distGeneratedNodeModules));
-
-return Promise.all(taskPromises);
+Promise.all([
+  getCodegenedFilesToDelete(),
+  fs.remove(distGeneratedNodeModules)
+]);

angular/test/nav/README.md

@@ -1,37 +0,0 @@
-# Demo
-
-The purpose of this application is to provide an Angular CLI application where Ionic Core components can be tested in a simple manner. This application allows the developer to experiment with interactions between Angular and Ionic in an easy and safe manner.
-
-## Getting started
-
-**Note:** This application now uses the last published `@ionic/core` package. To test against changes that you have made locally to core use `npm link` (see below).
-
-To use _this_ application perform the following commands from this directory:
-
-- `npm i`
-- `npm start` - to serve the application
-- `npm test` - to run the unit tests
-- `npm run e2e` - to run the end to end tests
-- `npx ts-node server/server.ts` - run the server required by any page that does a test post
-
-See the `package.json` file for a complete list of scripts. The above are just the most common.
-
-## Running the Angular CLI
-
-This application installs the Angular CLI locally so you do not need to have it installed globally. You can use `npm` to run any of the `ng` commands. For example:
-
-- `npm run ng build -- --prod` - run a production build
-- `npm run ng g component my-cool-thing`
-
-## Testing Local Changes
-
-In order to test local changes they need to be copied into `node_modules` after the initial `npm i`
-
-1. In `core`, run `npm run build`
-1. In `demos/angular`, run `rm -rf node_modules/\@ionic/core/dist`
-1. In `demos/angular`, run `cp -R ../../core/dist node_modules/\@ionic/core/dist`
-
-Use a similar procedure if you want to test local changes to `@ionic/angular`
-
-**Note:** A couple of short scripts have been created to handle the copy bits. Just run `./cpang.sh` or `./cpcore.sh` from
-`demos/angular` after you have built `@ionic/angular` or `@ionic/core`.

angular/test/nav/karma.conf.js

@@ -22,11 +22,7 @@ module.exports = function(config) {
     angularCli: {
       environment: 'dev'
     },
-    files: [
-      // TODO: I have not fully worked out how this will work.
-      //       Perhaps just the base include with a plugin?
-      { pattern: '../node_modules/@ionic/core/dist/ionic.js', watched: false, served: false, nocache: true, included: true }
-    ],
+    files: [],
     reporters: ['progress', 'kjhtml'],
     port: 9876,
     colors: true,

angular/test/nav/package.json

@@ -1,6 +1,7 @@
 {
-  "name": "@ionic/angular-demo",
-  "version": "0.0.0",
+  "name": "@ionic/angular-test-nav",
+  "private": true,
+  "version": "0.0.1",
   "license": "MIT",
   "scripts": {
     "ng": "ng",
@@ -8,10 +9,8 @@
     "build": "ng build",
     "test": "ng test",
     "lint": "ng lint",
-    "e2e": "ng e2e",
-    "override-router": "rm -rf ./node_modules/@angular/router && mkdir ./node_modules/@angular/router && cp -R ./scripts/router ./node_modules/@angular"
+    "e2e": "ng e2e"
   },
-  "private": true,
   "dependencies": {
     "@angular/animations": "latest",
     "@angular/common": "latest",

angular/test/nav/server/server.ts

@@ -1,25 +0,0 @@
-import * as bodyParser from 'body-parser';
-import * as express from 'express';
-
-const app = express();
-
-app.set('port', process.env.PORT || 5000);
-
-app.use(bodyParser.urlencoded({extended: true}));
-app.use(bodyParser.json());
-
-app.use(function(req, res, next) {
-  res.header('Access-Control-Allow-Origin', '*');
-  res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
-  res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
-
-  next();
-});
-
-app.post('/test', (req, res) => {
-  res.send(req.body);
-});
-
-app.listen(app.get('port'), () => {
-  console.log('Node app is running on port', app.get('port'));
-});

angular/test/nav/src/styles.scss

@@ -1,3 +1 @@
 /* You can add global styles to this file, and also import other style files */
-
-// @import '~@ionic/core/src/themes/ionic.build.default';

angular/test/nav/tsconfig.json

@@ -8,12 +8,24 @@
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "target": "es5",
-    "typeRoots": [
-      "node_modules/@types"
-    ],
     "lib": [
-      "es2017",
-      "dom"
-    ]
+      "dom",
+      "es2017"
+    ],
+    "baseUrl": ".",
+    "paths": {
+      "@angular/animations": ["../../../node_modules/@angular/animations/"],
+      "@angular/common": ["../../../node_modules/@angular/common/"],
+      "@angular/compiler": ["../../../node_modules/@angular/compiler/"],
+      "@angular/core": ["../../../node_modules/@angular/core/"],
+      "@angular/forms": ["../../../node_modules/@angular/forms/"],
+      "@angular/http": ["../../../node_modules/@angular/http/"],
+      "@angular/language-service": ["../../../node_modules/@angular/language-service/"],
+      "@angular/platform-browser": ["../../../node_modules/@angular/platform-browser/"],
+      "@angular/platform-browser-dynamic": ["../../../node_modules/@angular/platform-browser-dynamic/"],
+      "@angular/router": ["../../../node_modules/@angular/router/"],
+      "rxjs": ["../../../node_modules/@angular/rxjs/"],
+      "@ionic/angular": ["../../../"]
+    }
   }
 }

angular/tsconfig.json

@@ -4,8 +4,10 @@
     "allowSyntheticDefaultImports": true,
     "allowUnreachableCode": false,
     "declaration": true,
-    "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true,
+    "jsx": "react",
+    "jsxFactory": "h",
     "lib": [
       "dom",
       "es2017"
@@ -20,8 +22,8 @@
     "pretty": true,
     "removeComments": false,
     "rootDir": "src",
-    "sourceMap": true,
-    "target": "es2015"
+    "strictPropertyInitialization": false,
+    "target": "es2017"
   },
   "files": [
     "src/index.ts"