Add bundles + Fix for @angular/cli 1.0.0-beta.32.3 #972

- Use @angular/cli version 1.0.0-beta.32.3
- Use rollup to generate bundles
  - `package.json` shamelessly copied from
https://github.com/bbottema/ng2-simple-page-scroll

Author: l-lin

.gitignore

@@ -16,10 +16,10 @@ _temp
 !karma*.js
 !protractor*.js
 !systemjs.config.js
-!typings/typings.d.ts
-!wallaby.js
-!index.js
-!index.d.js
-!dist/*.js
-!dist/*.js.map
 !demo/src/**/*.js
+
+# angular-datatables specific
+*.js.map
+*.d.ts
+*.metadata.json
+index*.js

.npmignore

@@ -1,19 +1,67 @@
-examples
+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directory
 node_modules
-src
-typings
-.editorconfig
-_test-output
-.travis.yml
+
+/.codeclimate.yml
+/.gitignore
+/.gitattributes
+/.npmignore
+/.travis.yml
+/.eslintignore
+/.eslintrc
+
+# Build System files
+/tslint.json
+/rollup-uglify.conf.js
+/rollup.conf.js
+/protractor.config.js
+/systemjs.config.js
+
+# Typescript source files
+*.ts
+!*.d.ts
+*.js.map
+!/bundles/*.js.map
+!*.metadata.json
+tsconfig.json
+tsconfig-build.json
+
+
+# Editor specific
+.idea
+.vscode
+
+# test cases
 karma-test-shim.js
 karma.conf.js
-tsconfig.json
-tslint.json
-typings.json
-protractor.config.js
+test
+_test-output
+
+# other stuffs
 .github
 DEVELOPER.md
-systemjs.config.js
-.vscode
+.editorconfig
+
+# angular-datatables specific
 demo
 deploy-doc.sh

.travis.yml

@@ -16,4 +16,4 @@ install:
   - npm install
 script:
   - npm run lint
-  - npm run test-once
+  - npm run compile:tsc

demo/README.md

@@ -24,4 +24,4 @@ You may need to have the following:
 
 ## Further help
 
-To get more help on the `angular-cli` use `ng --help` or go check out the [Angular-CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

demo/angular-cli.json

@@ -1,6 +1,7 @@
 {
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "project": {
-    "version": "1.0.0-beta.24",
+    "version": "1.0.0-beta.32.3",
     "name": "angular-datatables-demo"
   },
   "apps": [
@@ -15,10 +16,10 @@
       ],
       "index": "index.html",
       "main": "main.ts",
+      "polyfills": "polyfills.ts",
       "test": "test.ts",
       "tsconfig": "tsconfig.json",
       "prefix": "app",
-      "mobile": false,
       "styles": [
         "../node_modules/datatables.net-dt/css/jquery.dataTables.css",
         "../node_modules/materialize-css/dist/css/materialize.css",
@@ -29,41 +30,35 @@
         "../node_modules/tether/dist/js/tether.js",
         "../node_modules/datatables.net/js/jquery.dataTables.js"
       ],
+      "environmentSource": "environments/environment.ts",
       "environments": {
-        "source": "environments/environment.ts",
         "dev": "environments/environment.ts",
         "prod": "environments/environment.prod.ts"
       }
     }
   ],
-  "addons": [],
-  "packages": [
-    "node_modules/angular2-highlight-js/lib"
-  ],
   "e2e": {
     "protractor": {
       "config": "./protractor.conf.js"
     }
   },
+  "lint": [
+    {
+      "files": "src/**/*.ts",
+      "project": "src/tsconfig.json"
+    },
+    {
+      "files": "e2e/**/*.ts",
+      "project": "e2e/tsconfig.json"
+    }
+  ],
   "test": {
     "karma": {
       "config": "./karma.conf.js"
     }
   },
   "defaults": {
     "styleExt": "css",
-    "prefixInterfaces": false,
-    "inline": {
-      "style": false,
-      "template": false
-    },
-    "spec": {
-      "class": false,
-      "component": true,
-      "directive": true,
-      "module": false,
-      "pipe": true,
-      "service": true
-    }
+    "component": {}
   }
 }

demo/karma.conf.js

@@ -4,35 +4,37 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', 'angular-cli'],
+    frameworks: ['jasmine', '@angular/cli'],
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
-      require('karma-remap-istanbul'),
-      require('angular-cli/plugins/karma')
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular/cli/plugins/karma')
     ],
+    client:{
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
     files: [
       { pattern: './src/test.ts', watched: false }
     ],
     preprocessors: {
-      './src/test.ts': ['angular-cli']
+      './src/test.ts': ['@angular/cli']
     },
     mime: {
       'text/x-typescript': ['ts','tsx']
     },
-    remapIstanbulReporter: {
-      reports: {
-        html: 'coverage',
-        lcovonly: './coverage/coverage.lcov'
-      }
+    coverageIstanbulReporter: {
+      reports: [ 'html', 'lcovonly' ],
+      fixWebpackSourcePaths: true
     },
     angularCli: {
-      config: './angular-cli.json',
+      config: './.angular-cli.json',
       environment: 'dev'
     },
     reporters: config.angularCli && config.angularCli.codeCoverage
-              ? ['progress', 'karma-remap-istanbul']
-              : ['progress'],
+              ? ['progress', 'coverage-istanbul']
+              : ['progress', 'kjhtml'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,

demo/package.json

@@ -4,57 +4,56 @@
   "license": "MIT",
   "angular-cli": {},
   "scripts": {
-    "lint": "tslint \"src/**/*.ts\"",
+    "ng": "ng",
+    "start": "ng serve",
     "test": "ng test",
-    "pree2e": "webdriver-manager update",
-    "e2e": "protractor"
+    "lint": "ng lint",
+    "e2e": "ng e2e"
   },
   "private": true,
   "dependencies": {
-    "@angular/common": "2.4.0",
-    "@angular/compiler": "2.4.0",
-    "@angular/core": "2.4.0",
-    "@angular/forms": "2.4.0",
-    "@angular/http": "2.4.0",
-    "@angular/platform-browser": "2.4.0",
-    "@angular/platform-browser-dynamic": "2.4.0",
-    "@angular/router": "3.2.1",
+    "@angular/common": "2.4.8",
+    "@angular/compiler": "2.4.8",
+    "@angular/core": "2.4.8",
+    "@angular/forms": "2.4.8",
+    "@angular/http": "2.4.8",
+    "@angular/platform-browser": "2.4.8",
+    "@angular/platform-browser-dynamic": "2.4.8",
+    "@angular/platform-server": "2.4.8",
+    "@angular/router": "3.4.8",
     "angular-datatables": "file:..",
     "angular2-highlight-js": "4.0.0",
     "core-js": "2.4.1",
-    "datatables.net": "2.1.1",
-    "datatables.net-bs": "2.1.1",
-    "datatables.net-dt": "2.1.1",
-    "datatables.net-responsive": "2.1.0",
-    "datatables.net-responsive-bs": "2.1.0",
+    "datatables.net": "1.10.13",
+    "datatables.net-dt": "1.10.13",
+    "datatables.net-responsive": "2.1.1",
     "datatables.net-scroller": "1.4.2",
-    "datatables.net-scroller-bs": "1.4.2",
-    "highlight.js": "9.8.0",
-    "jquery": "3.1.0",
-    "materialize-css": "0.97.8",
+    "highlight.js": "9.9.0",
+    "jquery": "3.1.1",
+    "materialize-css": "0.98.0",
     "ng2-simple-page-scroll": "2.0.0",
-    "rxjs": "5.1.0",
+    "rxjs": "5.1.1",
     "tether": "1.3.8",
     "ts-helpers": "1.1.1",
-    "zone.js": "0.7.6"
+    "zone.js": "0.7.7"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "2.4.0",
+    "@angular/cli": "1.0.0-beta.32.3",
+    "@angular/compiler-cli": "2.4.8",
     "@types/jasmine": "2.5.38",
-    "@types/node": "6.0.42",
-    "angular-cli": "1.0.0-beta.21",
-    "codelyzer": "1.0.0-beta.3",
-    "jasmine-core": "2.5.2",
-    "jasmine-spec-reporter": "2.5.0",
-    "karma": "1.2.0",
-    "karma-chrome-launcher": "2.0.0",
-    "karma-cli": "1.0.1",
-    "karma-jasmine": "1.0.2",
-    "karma-remap-istanbul": "0.2.1",
-    "protractor": "4.0.9",
-    "ts-node": "1.2.1",
-    "tslint": "3.13.0",
-    "typescript": "2.0.3",
-    "webdriver-manager": "10.2.5"
+    "@types/node": "~6.0.60",
+    "codelyzer": "~2.0.0-beta.4",
+    "jasmine-core": "~2.5.2",
+    "jasmine-spec-reporter": "~3.2.0",
+    "karma": "~1.4.1",
+    "karma-chrome-launcher": "~2.0.0",
+    "karma-cli": "~1.0.1",
+    "karma-jasmine": "~1.1.0",
+    "karma-jasmine-html-reporter": "^0.2.2",
+    "karma-coverage-istanbul-reporter": "^0.2.0",
+    "protractor": "~5.1.0",
+    "ts-node": "~2.0.0",
+    "tslint": "~4.4.2",
+    "typescript": "~2.0.10"
   }
 }

demo/protractor.conf.js

@@ -1,8 +1,8 @@
 // Protractor configuration file, see link for more information
-// https://github.com/angular/protractor/blob/master/docs/referenceConf.js
+// https://github.com/angular/protractor/blob/master/lib/config.ts
 
 /*global jasmine */
-var SpecReporter = require('jasmine-spec-reporter');
+const { SpecReporter } = require('jasmine-spec-reporter');
 
 exports.config = {
   allScriptsTimeout: 11000,
@@ -20,13 +20,12 @@ exports.config = {
     defaultTimeoutInterval: 30000,
     print: function() {}
   },
-  useAllAngular2AppRoots: true,
   beforeLaunch: function() {
     require('ts-node').register({
       project: 'e2e'
     });
   },
-  onPrepare: function() {
-    jasmine.getEnv().addReporter(new SpecReporter());
+  onPrepare() {
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
   }
 };

demo/src/app/app.component.ts

@@ -1,7 +1,5 @@
 import { Component, ElementRef } from '@angular/core';
 
-import { HighlightJsService } from 'angular2-highlight-js';
-
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',

demo/src/app/getting-started.component.html

@@ -13,16 +13,16 @@ <h1 class="header center-on-small-only">Getting started</h1>
       <div class="section">
         <h2 class="header">Installation</h2>
         <p class="caption">
-          To use angular-datatables, you need to have <a href="https://docs.npmjs.com/getting-started/installing-node">Node 4 or higher and NPM 3 or higher installed</a>.
+          To use angular-datatables, you need to have <a href="https://docs.npmjs.com/getting-started/installing-node">Node 6.9.0 or higher and NPM 3 or higher installed</a>.
         </p>
         <p class="caption">
           The documentation will only deal with projects that use <a href="https://github.com/angular/angular-cli">angular-cli</a>. Indeed, the front-end ecosystem is evolving at a pace I can't follow anymore. Thus, there will only have a tutorial for angular-cli's project. If you managed to make it work in, for example, SystemJS projects, please submit a pull request to improve this documentation. Thanks!
         </p>
         <div class="col s12">
-          <h4>Angular-CLI version 1.0.0-beta.21</h4>
+          <h4>Angular-CLI version 1.0.0-beta.32.3</h4>
           <p>I recommend using <a href="https://github.com/angular/angular-cli">angular-cli</a> to create and manage your angular2 project</p>
           <p>
-            Since Angular-CLI is still in beta, I prefer to warn you the demo was developpped in version <b>1.0.0-beta.21</b> and newer version of Angular-CLI may need to have different configuration.
+            Since Angular-CLI is still in beta, I prefer to warn you the demo was developpped in version <b>1.0.0-beta.32.3</b> and newer version of Angular-CLI may need to have different configuration.
           </p>
         </div>
         <div class="col s12">
@@ -43,7 +43,6 @@ <h4 id="angular-cli">angular-cli.json</h4>
           <h4 id="ng-module">NgModule</h4>
           <p>
             Import the <code>DataTablesModule</code> at the appropriate level of your app.
-            See the <a href="https://github.com/angular/angular-cli#3rd-party-library-installation">angular-cli documentation</a> for more information about installing 3rd party libraries.
           </p>
           <section [innerHTML]="ngModuleSnippet" highlight-js-content=".typescript"></section>
         </div>