From 650a4d17e82d06e4af0d8d937dbd8fdd8cfba2f8 Mon Sep 17 00:00:00 2001 From: Ward Bell Date: Sat, 21 May 2016 14:15:48 -0700 Subject: [PATCH 01/26] docs(samples): package.json and typings updates --- public/docs/_examples/package.json | 4 ++-- public/docs/_examples/quickstart/js/package.1.json | 2 +- public/docs/_examples/quickstart/ts/package.1.json | 4 ++-- public/docs/_examples/quickstart/ts/tsconfig.1.json | 7 +------ public/docs/_examples/quickstart/ts/typings.1.json | 2 +- public/docs/_examples/tsconfig.json | 7 +------ public/docs/_examples/typings.json | 2 +- 7 files changed, 9 insertions(+), 19 deletions(-) diff --git a/public/docs/_examples/package.json b/public/docs/_examples/package.json index b89d74462e..3a83c2bdf3 100644 --- a/public/docs/_examples/package.json +++ b/public/docs/_examples/package.json @@ -38,7 +38,7 @@ "rxjs": "5.0.0-beta.6", "zone.js": "^0.6.12", - "angular2-in-memory-web-api": "0.0.9", + "angular2-in-memory-web-api": "0.0.10", "bootstrap": "^3.3.6" }, "devDependencies": { @@ -69,7 +69,7 @@ "style-loader": "^0.13.1", "ts-loader": "^0.8.2", "typescript": "^1.8.10", - "typings": "^0.8.1", + "typings": "^1.0.4", "webpack": "^1.13.0", "webpack-dev-server": "^1.14.1", "webpack-merge": "^0.12.0" diff --git a/public/docs/_examples/quickstart/js/package.1.json b/public/docs/_examples/quickstart/js/package.1.json index 776835efa8..504b6e7413 100644 --- a/public/docs/_examples/quickstart/js/package.1.json +++ b/public/docs/_examples/quickstart/js/package.1.json @@ -22,7 +22,7 @@ "rxjs": "5.0.0-beta.6", "zone.js": "0.6.12", - "angular2-in-memory-web-api": "0.0.9", + "angular2-in-memory-web-api": "0.0.10", "bootstrap": "^3.3.6" }, "devDependencies": { diff --git a/public/docs/_examples/quickstart/ts/package.1.json b/public/docs/_examples/quickstart/ts/package.1.json index 5cac25cd60..6b26bacea1 100644 --- a/public/docs/_examples/quickstart/ts/package.1.json +++ b/public/docs/_examples/quickstart/ts/package.1.json @@ -27,13 +27,13 @@ "rxjs": "5.0.0-beta.6", "zone.js": "^0.6.12", - "angular2-in-memory-web-api": "0.0.9", + "angular2-in-memory-web-api": "0.0.10", "bootstrap": "^3.3.6" }, "devDependencies": { "concurrently": "^2.0.0", "lite-server": "^2.2.0", "typescript": "^1.8.10", - "typings":"^0.8.1" + "typings":"^1.0.4" } } diff --git a/public/docs/_examples/quickstart/ts/tsconfig.1.json b/public/docs/_examples/quickstart/ts/tsconfig.1.json index c9b986dfd6..e6a6eac11d 100644 --- a/public/docs/_examples/quickstart/ts/tsconfig.1.json +++ b/public/docs/_examples/quickstart/ts/tsconfig.1.json @@ -8,10 +8,5 @@ "experimentalDecorators": true, "removeComments": false, "noImplicitAny": false - }, - "exclude": [ - "node_modules", - "typings/main", - "typings/main.d.ts" - ] + } } diff --git a/public/docs/_examples/quickstart/ts/typings.1.json b/public/docs/_examples/quickstart/ts/typings.1.json index ab3d27d712..debe293225 100644 --- a/public/docs/_examples/quickstart/ts/typings.1.json +++ b/public/docs/_examples/quickstart/ts/typings.1.json @@ -1,5 +1,5 @@ { - "ambientDependencies": { + "globalDevDependencies": { "core-js": "registry:dt/core-js#0.0.0+20160317120654", "jasmine": "registry:dt/jasmine#2.2.0+20160412134438", "node": "registry:dt/node#4.0.0+20160509154515" diff --git a/public/docs/_examples/tsconfig.json b/public/docs/_examples/tsconfig.json index 302417ff3d..fd1d10190d 100644 --- a/public/docs/_examples/tsconfig.json +++ b/public/docs/_examples/tsconfig.json @@ -9,10 +9,5 @@ "removeComments": false, "noImplicitAny": true, "suppressImplicitAnyIndexErrors": true - }, - "exclude": [ - "node_modules", - "typings/main", - "typings/main.d.ts" - ] + } } diff --git a/public/docs/_examples/typings.json b/public/docs/_examples/typings.json index ab3d27d712..debe293225 100644 --- a/public/docs/_examples/typings.json +++ b/public/docs/_examples/typings.json @@ -1,5 +1,5 @@ { - "ambientDependencies": { + "globalDevDependencies": { "core-js": "registry:dt/core-js#0.0.0+20160317120654", "jasmine": "registry:dt/jasmine#2.2.0+20160412134438", "node": "registry:dt/node#4.0.0+20160509154515" From 4b104d7cc9391bad0b34613a204738ba60df8e1b Mon Sep 17 00:00:00 2001 From: Ward Bell Date: Sat, 21 May 2016 14:31:22 -0700 Subject: [PATCH 02/26] docs(testing): update testing setup to use systemjs.config.js --- public/docs/_examples/karma-test-shim.js | 91 +++++----------- public/docs/_examples/karma.conf.js | 1 + public/docs/_examples/systemjs.config.js | 17 +-- .../docs/_examples/testing/ts/tsconfig.1.json | 7 +- public/docs/_examples/wallaby.js | 102 +++++------------- 5 files changed, 67 insertions(+), 151 deletions(-) diff --git a/public/docs/_examples/karma-test-shim.js b/public/docs/_examples/karma-test-shim.js index bc8cf372f3..ec50e1ff66 100644 --- a/public/docs/_examples/karma-test-shim.js +++ b/public/docs/_examples/karma-test-shim.js @@ -22,72 +22,33 @@ var allSpecFiles = Object.keys(window.__karma__.files) .filter(isSpecFile) .filter(isBuiltFile); -////////////////////////// -// Load our SystemJS configuration. - -// map tells the System loader where to look for things -var map = { - 'app': 'app', - - '@angular': 'node_modules/@angular', - 'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', - 'rxjs': 'node_modules/rxjs' -}; - -// packages tells the System loader how to load when no filename and/or no extension -var packages = { - 'app': { main: 'main.js', defaultExtension: 'js' }, - 'rxjs': { defaultExtension: 'js' }, - 'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, -}; - -var ngPackageNames = [ - 'common', - 'compiler', - 'core', - 'http', - 'platform-browser', - 'platform-browser-dynamic', - 'router', - 'router-deprecated', - 'upgrade', -]; - -// Add package entries for angular packages -ngPackageNames.forEach(function(pkgName) { - - // Bundled (~40 requests): DOESN'T WORK IN KARMA OR WALLABY (YET?) - //packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' }; - - // Individual files (~300 requests): - packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; +System.config({ + baseURL: '/base', + packageWithIndex: true // sadly, we can't use umd packages (yet?) }); -var config = { - baseURL: '/base', - map: map, - packages: packages -} +System.import('systemjs.config.js') + .then(function () { + return Promise.all([ + System.import('@angular/core/testing'), + System.import('@angular/platform-browser-dynamic/testing') + ]) + }) + .then(function (providers) { + var testing = providers[0]; + var testingBrowser = providers[1]; -System.config(config); -////////////// + testing.setBaseTestProviders( + testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, + testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); -Promise.all([ - System.import('@angular/core/testing'), - System.import('@angular/platform-browser-dynamic/testing') -]).then(function (providers) { - var testing = providers[0]; - var testingBrowser = providers[1]; - - testing.setBaseTestProviders( - testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, - testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); - -}).then(function() { - // Finally, load all spec files. - // This will run the tests directly. - return Promise.all( - allSpecFiles.map(function (moduleName) { - return System.import(moduleName); - })); -}).then(__karma__.start, __karma__.error); + }) + .then(function() { + // Finally, load all spec files. + // This will run the tests directly. + return Promise.all( + allSpecFiles.map(function (moduleName) { + return System.import(moduleName); + })); + }) + .then(__karma__.start, __karma__.error); diff --git a/public/docs/_examples/karma.conf.js b/public/docs/_examples/karma.conf.js index d39e2ffac8..faa52df98e 100644 --- a/public/docs/_examples/karma.conf.js +++ b/public/docs/_examples/karma.conf.js @@ -42,6 +42,7 @@ module.exports = function(config) { {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false}, {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false}, + {pattern: 'systemjs.config.js', included: false, watched: false}, 'karma-test-shim.js', // transpiled application & spec code paths loaded via module imports diff --git a/public/docs/_examples/systemjs.config.js b/public/docs/_examples/systemjs.config.js index 56d5f61e5f..0cdf7d40bc 100644 --- a/public/docs/_examples/systemjs.config.js +++ b/public/docs/_examples/systemjs.config.js @@ -32,15 +32,20 @@ 'upgrade', ]; - // Add package entries for angular packages - ngPackageNames.forEach(function(pkgName) { + // Individual files (~300 requests): + function packIndex(pkgName) { + packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; + } - // Bundled (~40 requests): + // Bundled (~40 requests): + function packUmd(pkgName) { packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' }; + }; - // Individual files (~300 requests): - //packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; - }); + var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; + + // Add package entries for angular packages + ngPackageNames.forEach(setPackageConfig); var config = { map: map, diff --git a/public/docs/_examples/testing/ts/tsconfig.1.json b/public/docs/_examples/testing/ts/tsconfig.1.json index 6ee6719cb3..062cf1bcb4 100644 --- a/public/docs/_examples/testing/ts/tsconfig.1.json +++ b/public/docs/_examples/testing/ts/tsconfig.1.json @@ -9,10 +9,5 @@ "removeComments": false, "noImplicitAny": true, "suppressImplicitAnyIndexErrors": true - }, - "exclude": [ - "node_modules", - "typings/main", - "typings/main.d.ts" - ] + } } diff --git a/public/docs/_examples/wallaby.js b/public/docs/_examples/wallaby.js index 2648c2c3aa..28053a11fe 100644 --- a/public/docs/_examples/wallaby.js +++ b/public/docs/_examples/wallaby.js @@ -8,6 +8,7 @@ module.exports = function () { files: [ // System.js for module loading {pattern: 'node_modules/systemjs/dist/system.js', instrument: false}, + {pattern: 'systemjs.config.js', instrument: false}, // Polyfills {pattern: 'node_modules/core-js/client/shim.min.js', instrument: false}, @@ -38,86 +39,39 @@ module.exports = function () { bootstrap: function (wallaby) { wallaby.delayStart(); - systemConfig(); - Promise.all([ - System.import('@angular/core/testing'), - System.import('@angular/platform-browser-dynamic/testing') - ]) - .then(function (providers) { - var testing = providers[0]; - var testingBrowser = providers[1]; - - testing.setBaseTestProviders( - testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, - testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); - - - // Load all spec files - return Promise.all(wallaby.tests.map(function (specFile) { - return System.import(specFile); - })); - }) - .then(function () { - wallaby.start(); - }) - .catch(function (e) { - setTimeout(function () { - throw e; - }, 0); + System.config({ + packageWithIndex: true // sadly, we can't use umd packages (yet?) }); - ////////////////////////// - // SystemJS configuration. - function systemConfig() { + System.import('systemjs.config.js') + .then(function () { + return Promise.all([ + System.import('@angular/core/testing'), + System.import('@angular/platform-browser-dynamic/testing') + ]) + }) + .then(function (providers) { + var testing = providers[0]; + var testingBrowser = providers[1]; - // map tells the System loader where to look for things - var map = { - 'app': 'app', + testing.setBaseTestProviders( + testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, + testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); - '@angular': 'node_modules/@angular', - 'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', - 'rxjs': 'node_modules/rxjs' - }; - - // packages tells the System loader how to load when no filename and/or no extension - var packages = { - 'app': { main: 'main.js', defaultExtension: 'js' }, - 'rxjs': { defaultExtension: 'js' }, - 'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, - }; - - var ngPackageNames = [ - 'common', - 'compiler', - 'core', - 'http', - 'platform-browser', - 'platform-browser-dynamic', - 'router', - 'router-deprecated', - 'upgrade', - ]; - - // Add package entries for angular packages - ngPackageNames.forEach(function(pkgName) { - - // Bundled (~40 requests): DOESN'T WORK IN WALLABY OR KARMA (YET?) - // packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' }; - - // Individual files (~300 requests): - packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; + // Load all spec files + return Promise.all(wallaby.tests.map(function (specFile) { + return System.import(specFile); + })); + }) + .then(function () { + wallaby.start(); + }) + .catch(function (e) { + setTimeout(function () { + throw e; + }, 0); }); - - var config = { - map: map, - packages: packages - } - - System.config(config); - } - ////////////////// } }; - }; From 10b0cde8c01e5665d73e26bafa37845a4392ce92 Mon Sep 17 00:00:00 2001 From: Foxandxss Date: Sat, 21 May 2016 23:49:05 +0200 Subject: [PATCH 03/26] docs(webpack): update typings --- public/docs/_examples/webpack/ts/package.webpack.json | 2 +- public/docs/_examples/webpack/ts/typings.1.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/public/docs/_examples/webpack/ts/package.webpack.json b/public/docs/_examples/webpack/ts/package.webpack.json index 618e1867ec..0e58f8680c 100644 --- a/public/docs/_examples/webpack/ts/package.webpack.json +++ b/public/docs/_examples/webpack/ts/package.webpack.json @@ -41,7 +41,7 @@ "style-loader": "^0.13.1", "ts-loader": "^0.8.1", "typescript": "^1.8.9", - "typings": "^0.7.12", + "typings": "^1.0.4", "webpack": "^1.12.14", "webpack-dev-server": "^1.14.1", "webpack-merge": "^0.9.0" diff --git a/public/docs/_examples/webpack/ts/typings.1.json b/public/docs/_examples/webpack/ts/typings.1.json index ab3d27d712..debe293225 100644 --- a/public/docs/_examples/webpack/ts/typings.1.json +++ b/public/docs/_examples/webpack/ts/typings.1.json @@ -1,5 +1,5 @@ { - "ambientDependencies": { + "globalDevDependencies": { "core-js": "registry:dt/core-js#0.0.0+20160317120654", "jasmine": "registry:dt/jasmine#2.2.0+20160412134438", "node": "registry:dt/node#4.0.0+20160509154515" From 899bae64a9d6abcd637e4fbce3177e747306f25b Mon Sep 17 00:00:00 2001 From: Foxandxss Date: Wed, 18 May 2016 15:53:13 +0200 Subject: [PATCH 04/26] docs(style-guide): add testing harness --- .../docs/_examples/style-guide/ts/.gitignore | 1 + .../ts/01-01/app/app.component.css | 0 .../style-guide/ts/01-01/app/app.component.ts | 3 +- .../style-guide/ts/02-07/app/app.component.ts | 14 ++++ .../ts/02-07/app/heroes/hero.component.ts | 4 ++ .../ts/02-07/app/users/users.component.ts | 4 ++ .../style-guide/ts/02-08/app/app.component.ts | 10 +++ .../style-guide/ts/03-01/app/app.component.ts | 18 +++++ .../ts/03-01/app/shared/exception.service.ts | 5 ++ .../style-guide/ts/03-02/app/app.component.ts | 15 +++++ .../style-guide/ts/03-03/app/app.component.ts | 19 ++++++ .../app/shared/hero-collector.service.ts | 12 ++++ .../style-guide/ts/03-04/app/app.component.ts | 27 ++++++++ .../03-04/app/shared/toast/toast.service.ts | 7 ++ .../03-05/app/+heroes/shared/hero.service.ts | 2 +- .../ts/03-05/app/app.component.html | 5 ++ .../style-guide/ts/03-05/app/app.component.ts | 21 ++++++ .../ts/03-06/app/app.component.html | 5 ++ .../style-guide/ts/03-06/app/app.component.ts | 21 ++++++ .../04-10/app/+heroes/heroes.component.html | 1 + .../ts/04-10/app/+heroes/heroes.component.ts | 3 +- .../style-guide/ts/04-10/app/app.component.ts | 4 +- .../style-guide/ts/04-14/app/app.component.ts | 10 +++ .../ts/04-14/app/heroes/heroes.component.html | 2 +- .../ts/04-14/app/heroes/heroes.component.ts | 1 + .../style-guide/ts/05-02/app/app.component.ts | 11 ++++ .../hero-button.component.avoid.ts | 7 +- .../hero-button/hero-button.component.html | 1 + .../hero-button/hero-button.component.ts | 7 +- .../style-guide/ts/05-03/app/app.component.ts | 11 ++++ .../hero-button.component.avoid.ts | 7 +- .../hero-button/hero-button.component.html | 1 + .../hero-button/hero-button.component.ts | 7 +- .../style-guide/ts/05-04/app/app.component.ts | 10 +++ .../ts/05-04/app/heroes/heroes.component.ts | 4 ++ .../style-guide/ts/05-12/app/app.component.ts | 10 +++ .../style-guide/ts/05-13/app/app.component.ts | 11 ++++ .../style-guide/ts/05-14/app/app.component.ts | 10 +++ .../style-guide/ts/05-15/app/app.component.ts | 12 ++++ .../ts/05-15/app/heroes/shared/index.ts | 4 +- .../style-guide/ts/05-16/app/app.component.ts | 11 ++++ .../style-guide/ts/05-17/app/app.component.ts | 10 +++ .../heroes/hero-list/hero-list.component.ts | 8 +++ .../ts/06-01/app/app.component.html | 2 +- .../style-guide/ts/06-01/app/app.component.ts | 11 ++++ .../style-guide/ts/06-03/app/app.component.ts | 10 +++ .../ts/07-01/app/app.component.html | 5 ++ .../style-guide/ts/07-01/app/app.component.ts | 20 ++++++ .../style-guide/ts/07-04/app/app.component.ts | 19 ++++++ .../app/heroes/shared/hero-arena.service.ts | 7 ++ .../ts/07-04/app/heroes/shared/index.ts | 1 + .../style-guide/ts/09-01/app/app.component.ts | 10 +++ .../style-guide/ts/app/app.component.html | 1 + .../style-guide/ts/app/app.component.ts | 65 +++++++++++++++++++ .../_examples/style-guide/ts/app/hero-data.ts | 11 ++++ .../docs/_examples/style-guide/ts/app/main.ts | 15 +++++ .../docs/_examples/style-guide/ts/index.html | 1 + .../style-guide/ts/systemjs.custom.js | 44 +++++++++++++ 58 files changed, 565 insertions(+), 13 deletions(-) create mode 100644 public/docs/_examples/style-guide/ts/01-01/app/app.component.css create mode 100644 public/docs/_examples/style-guide/ts/02-07/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/02-08/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-01/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-02/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-03/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-04/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-05/app/app.component.html create mode 100644 public/docs/_examples/style-guide/ts/03-05/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/03-06/app/app.component.html create mode 100644 public/docs/_examples/style-guide/ts/03-06/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.html create mode 100644 public/docs/_examples/style-guide/ts/04-14/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-02/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.html create mode 100644 public/docs/_examples/style-guide/ts/05-03/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.html create mode 100644 public/docs/_examples/style-guide/ts/05-04/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-12/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-13/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-14/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-15/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-16/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/05-17/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/06-01/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/06-03/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/07-01/app/app.component.html create mode 100644 public/docs/_examples/style-guide/ts/07-01/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/07-04/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/09-01/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/app/app.component.html create mode 100644 public/docs/_examples/style-guide/ts/app/app.component.ts create mode 100644 public/docs/_examples/style-guide/ts/app/hero-data.ts create mode 100644 public/docs/_examples/style-guide/ts/app/main.ts create mode 100644 public/docs/_examples/style-guide/ts/systemjs.custom.js diff --git a/public/docs/_examples/style-guide/ts/.gitignore b/public/docs/_examples/style-guide/ts/.gitignore index a6c7c2852d..bd6423cecb 100644 --- a/public/docs/_examples/style-guide/ts/.gitignore +++ b/public/docs/_examples/style-guide/ts/.gitignore @@ -1 +1,2 @@ *.js +!systemjs.custom.js diff --git a/public/docs/_examples/style-guide/ts/01-01/app/app.component.css b/public/docs/_examples/style-guide/ts/01-01/app/app.component.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts index afe49b80a8..a35bd6d420 100644 --- a/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts +++ b/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts @@ -7,11 +7,12 @@ import { HeroesComponent } from './heroes/heroes.component'; import { HeroService } from './heroes/shared/hero.service'; @Component({ + moduleId: module.id, selector: 'toh-app', template: ` `, - styleUrls: ['app/app.component.css'], + styleUrls: ['app.component.css'], directives: [HeroesComponent], providers: [HeroService] }) diff --git a/public/docs/_examples/style-guide/ts/02-07/app/app.component.ts b/public/docs/_examples/style-guide/ts/02-07/app/app.component.ts new file mode 100644 index 0000000000..408a34f5d6 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/02-07/app/app.component.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; + +import { HeroComponent } from './heroes/hero.component'; +import { UsersComponent } from './users/users.component'; + +@Component({ + selector: 'sg-app', + template: ` + + + `, + directives: [HeroComponent, UsersComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/02-07/app/heroes/hero.component.ts b/public/docs/_examples/style-guide/ts/02-07/app/heroes/hero.component.ts index d324036ef0..44c04dd855 100644 --- a/public/docs/_examples/style-guide/ts/02-07/app/heroes/hero.component.ts +++ b/public/docs/_examples/style-guide/ts/02-07/app/heroes/hero.component.ts @@ -1,8 +1,12 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example @Component({ + // #enddocregion example + template: '
hero component
', + // #docregion example selector: 'toh-hero' }) export class HeroComponent {} diff --git a/public/docs/_examples/style-guide/ts/02-07/app/users/users.component.ts b/public/docs/_examples/style-guide/ts/02-07/app/users/users.component.ts index 6597c57ec0..2fb6d54ebe 100644 --- a/public/docs/_examples/style-guide/ts/02-07/app/users/users.component.ts +++ b/public/docs/_examples/style-guide/ts/02-07/app/users/users.component.ts @@ -1,8 +1,12 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example @Component({ + // #enddocregion example + template: '
users component
', + // #docregion example selector: 'admin-users' }) export class UsersComponent {} diff --git a/public/docs/_examples/style-guide/ts/02-08/app/app.component.ts b/public/docs/_examples/style-guide/ts/02-08/app/app.component.ts new file mode 100644 index 0000000000..ffc693e1a7 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/02-08/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { ValidateDirective } from './shared/validate.directive'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [ValidateDirective] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/03-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-01/app/app.component.ts new file mode 100644 index 0000000000..cd8666bd52 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-01/app/app.component.ts @@ -0,0 +1,18 @@ +import { Component, OnInit } from '@angular/core'; + +import { ExceptionService } from './shared/exception.service'; + +@Component({ + selector: 'sg-app', + template: '
The expected error is {{errorCode}}
', + providers: [ExceptionService] +}) +export class AppComponent implements OnInit { + errorCode: number; + + constructor(private exceptionService: ExceptionService) { } + + ngOnInit() { + this.errorCode = this.exceptionService.getException(); + } +} diff --git a/public/docs/_examples/style-guide/ts/03-01/app/shared/exception.service.ts b/public/docs/_examples/style-guide/ts/03-01/app/shared/exception.service.ts index dd149b2046..dd77b4f7dc 100644 --- a/public/docs/_examples/style-guide/ts/03-01/app/shared/exception.service.ts +++ b/public/docs/_examples/style-guide/ts/03-01/app/shared/exception.service.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion import { Injectable } from '@angular/core'; @@ -5,5 +6,9 @@ import { Injectable } from '@angular/core'; // #docregion example export class ExceptionService { constructor() { } + // #enddocregion example + // testing harness + getException() { return 42; } + // #docregion example } // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/03-02/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-02/app/app.component.ts new file mode 100644 index 0000000000..73ceb239dc --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-02/app/app.component.ts @@ -0,0 +1,15 @@ +import { Component } from '@angular/core'; + +import { HEROES_URL, VILLAIN_URL } from './shared/data.service'; + +@Component({ + selector: 'sg-app', + template: ` +
Heroes url: {{heroesUrl}}
+
Villains url: {{villainsUrl}}
+ `, +}) +export class AppComponent { + heroesUrl = HEROES_URL; + villainsUrl = VILLAIN_URL; +} diff --git a/public/docs/_examples/style-guide/ts/03-03/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-03/app/app.component.ts new file mode 100644 index 0000000000..bd2f43025d --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-03/app/app.component.ts @@ -0,0 +1,19 @@ +import { Component, OnInit } from '@angular/core'; + +import { HeroCollectorService } from './shared/hero-collector.service'; +import { Hero } from './shared/hero.model'; + +@Component({ + selector: 'sg-app', + template: '
Our hero is {{hero.name}} and {{hero.power}}
', + providers: [HeroCollectorService] +}) +export class AppComponent implements OnInit { + hero: Hero; + + constructor(private heroCollectorService: HeroCollectorService) { } + + ngOnInit() { + this.hero = this.heroCollectorService.getHero(); + } +} diff --git a/public/docs/_examples/style-guide/ts/03-03/app/shared/hero-collector.service.ts b/public/docs/_examples/style-guide/ts/03-03/app/shared/hero-collector.service.ts index 4be6b989c2..1df5c0deb0 100644 --- a/public/docs/_examples/style-guide/ts/03-03/app/shared/hero-collector.service.ts +++ b/public/docs/_examples/style-guide/ts/03-03/app/shared/hero-collector.service.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion // #docregion example import { Injectable } from '@angular/core'; @@ -9,5 +10,16 @@ export class HeroCollectorService { hero: Hero; constructor() { } + // #enddocregion example + // testing harness + getHero() { + this.hero = { + name: 'RubberMan', + power: 'He is so elastic' + }; + + return this.hero; + } + // #docregion example } // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/03-04/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-04/app/app.component.ts new file mode 100644 index 0000000000..1b25bcd5ca --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-04/app/app.component.ts @@ -0,0 +1,27 @@ +import { Component, OnInit } from '@angular/core'; + +import { ToastService } from './shared/toast/toast.service'; + +@Component({ + selector: 'sg-app', + template: ` + + + `, + providers: [ToastService] +}) +export class AppComponent implements OnInit { + constructor(private toastService: ToastService) { } + + hide() { + this.toastService.hide(); + } + + show() { + this.toastService.show(); + } + + ngOnInit() { + this.toastService.activate('Hello style-guide!'); + } +} diff --git a/public/docs/_examples/style-guide/ts/03-04/app/shared/toast/toast.service.ts b/public/docs/_examples/style-guide/ts/03-04/app/shared/toast/toast.service.ts index 228a4dbd6b..ab148a1732 100644 --- a/public/docs/_examples/style-guide/ts/03-04/app/shared/toast/toast.service.ts +++ b/public/docs/_examples/style-guide/ts/03-04/app/shared/toast/toast.service.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion // #docregion example import { Injectable } from '@angular/core'; @@ -21,5 +22,11 @@ export class ToastService { private log() { console.log(this.message); } + // #enddocregion example + // testing harness + activate(message: string) { + this.message = message; + } + // #docregion example } // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/03-05/app/+heroes/shared/hero.service.ts b/public/docs/_examples/style-guide/ts/03-05/app/+heroes/shared/hero.service.ts index 817fdbead1..85fa486432 100644 --- a/public/docs/_examples/style-guide/ts/03-05/app/+heroes/shared/hero.service.ts +++ b/public/docs/_examples/style-guide/ts/03-05/app/+heroes/shared/hero.service.ts @@ -19,7 +19,7 @@ export class HeroService { ) { } getHero(id: number) { - return this.http.get(`api/heroes/${id}`) + return this.http.get(`app/heroes/${id}`) .map((res: Response) => res.json().data); } diff --git a/public/docs/_examples/style-guide/ts/03-05/app/app.component.html b/public/docs/_examples/style-guide/ts/03-05/app/app.component.html new file mode 100644 index 0000000000..3c05329f3f --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-05/app/app.component.html @@ -0,0 +1,5 @@ +
    +
  • + {{hero.name}} +
    • +
diff --git a/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts new file mode 100644 index 0000000000..9cc5ee4ec3 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts @@ -0,0 +1,21 @@ +import { Component, OnInit } from '@angular/core'; + +import { HeroService } from './+heroes/shared/hero.service'; +import { ExceptionService, SpinnerService, ToastService } from './shared'; +import { Hero } from './+heroes/shared/hero.model'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + providers: [HeroService, ExceptionService, SpinnerService, ToastService] +}) +export class AppComponent implements OnInit { + heroes: Hero[]; + + constructor(private heroService: HeroService) { } + + ngOnInit() { + this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes); + } +} diff --git a/public/docs/_examples/style-guide/ts/03-06/app/app.component.html b/public/docs/_examples/style-guide/ts/03-06/app/app.component.html new file mode 100644 index 0000000000..3c05329f3f --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-06/app/app.component.html @@ -0,0 +1,5 @@ +
    +
  • + {{hero.name}} +
    • +
diff --git a/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts new file mode 100644 index 0000000000..9cc5ee4ec3 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts @@ -0,0 +1,21 @@ +import { Component, OnInit } from '@angular/core'; + +import { HeroService } from './+heroes/shared/hero.service'; +import { ExceptionService, SpinnerService, ToastService } from './shared'; +import { Hero } from './+heroes/shared/hero.model'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + providers: [HeroService, ExceptionService, SpinnerService, ToastService] +}) +export class AppComponent implements OnInit { + heroes: Hero[]; + + constructor(private heroService: HeroService) { } + + ngOnInit() { + this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes); + } +} diff --git a/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.html b/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.html new file mode 100644 index 0000000000..1244e68a4a --- /dev/null +++ b/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.html @@ -0,0 +1 @@ +
This is heroes component
diff --git a/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.ts index ba822be033..9ca611ee5c 100644 --- a/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.ts +++ b/public/docs/_examples/style-guide/ts/04-10/app/+heroes/heroes.component.ts @@ -15,12 +15,13 @@ import { @Component({ // #enddocregion example + moduleId: module.id, providers: [EntityService, ExceptionService, SpinnerService, ToastService], directives: [FilterTextComponent], pipes: [InitCapsPipe], // #docregion example selector: 'toh-heroes', - templateUrl: 'app/+heroes/heroes.component.html' + templateUrl: 'heroes.component.html' }) export class HeroesComponent implements OnInit { // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/04-10/app/app.component.ts b/public/docs/_examples/style-guide/ts/04-10/app/app.component.ts index 8e143a5a59..e0c50dc7e7 100644 --- a/public/docs/_examples/style-guide/ts/04-10/app/app.component.ts +++ b/public/docs/_examples/style-guide/ts/04-10/app/app.component.ts @@ -6,8 +6,8 @@ import { HeroesComponent } from './+heroes/index'; // #enddocregion example @Component({ - selector: 'toh-app', - template: '
app
', + selector: 'sg-app', + template: '', directives: [HeroesComponent] }) export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/04-14/app/app.component.ts b/public/docs/_examples/style-guide/ts/04-14/app/app.component.ts new file mode 100644 index 0000000000..8ceb6f5de0 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/04-14/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { HeroesComponent } from './heroes/heroes.component'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroesComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.html b/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.html index b899229cab..b6bf75ef1a 100644 --- a/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.html +++ b/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.html @@ -2,7 +2,7 @@

My Heroes

    -
  • +
  • {{hero.id}} {{hero.name}}
diff --git a/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.ts index c72952e2c7..da3520ccce 100644 --- a/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.ts +++ b/public/docs/_examples/style-guide/ts/04-14/app/heroes/heroes.component.ts @@ -7,6 +7,7 @@ import { Logger } from '../shared/logger.service'; // #enddocregion example @Component({ + moduleId: module.id, selector: 'toh-heroes', templateUrl: 'heroes.component.html', styleUrls: ['heroes.component.css'], diff --git a/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts new file mode 100644 index 0000000000..aec6735502 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +import { HeroButtonComponent } from './heroes/shared/hero-button/hero-button.component'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + directives: [HeroButtonComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts index ec7145d349..7be30dc913 100644 --- a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts +++ b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts @@ -1,10 +1,15 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example /* avoid */ @Component({ - selector: 'tohHeroButton' + // #enddocregion example + moduleId: module.id, + // #docregion example + selector: 'tohHeroButton', + templateUrl: 'hero-button.component.html' }) export class HeroButtonComponent {} // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.html b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.html new file mode 100644 index 0000000000..9ad67e50ac --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.html @@ -0,0 +1 @@ + diff --git a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts index 523fc4e2fb..439ce328d5 100644 --- a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts +++ b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts @@ -1,9 +1,14 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example @Component({ - selector: 'toh-hero-button' + // #enddocregion example + moduleId: module.id, + // #docregion example + selector: 'toh-hero-button', + templateUrl: 'hero-button.component.html' }) export class HeroButtonComponent {} // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts new file mode 100644 index 0000000000..aec6735502 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +import { HeroButtonComponent } from './heroes/shared/hero-button/hero-button.component'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + directives: [HeroButtonComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts index e7358e4de6..4cbf731912 100644 --- a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts +++ b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts @@ -1,10 +1,15 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example /* avoid */ @Component({ - selector: '[tohHeroButton]' + // #enddocregion example + moduleId: module.id, + // #docregion example + selector: '[tohHeroButton]', + templateUrl: 'hero-button.component.html' }) export class HeroButtonComponent {} // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.html b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.html new file mode 100644 index 0000000000..9ad67e50ac --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.html @@ -0,0 +1 @@ + diff --git a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts index 523fc4e2fb..439ce328d5 100644 --- a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts +++ b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts @@ -1,9 +1,14 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; // #docregion example @Component({ - selector: 'toh-hero-button' + // #enddocregion example + moduleId: module.id, + // #docregion example + selector: 'toh-hero-button', + templateUrl: 'hero-button.component.html' }) export class HeroButtonComponent {} // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/05-04/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-04/app/app.component.ts new file mode 100644 index 0000000000..8ceb6f5de0 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-04/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { HeroesComponent } from './heroes/heroes.component'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroesComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts index ec91f419a5..0c59fac703 100644 --- a/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts +++ b/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion import { Component, OnInit } from '@angular/core'; @@ -5,6 +6,9 @@ import { Hero } from './shared/hero.model'; // #docregion example @Component({ + // #enddocregion example + moduleId: module.id, + // #docregion example selector: 'toh-heroes', templateUrl: 'heroes.component.html', styleUrls: ['heroes.component.css'] diff --git a/public/docs/_examples/style-guide/ts/05-12/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-12/app/app.component.ts new file mode 100644 index 0000000000..089468ba0a --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-12/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { HeroButtonComponent } from './heroes/shared/hero-button/hero-button.component'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroButtonComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts new file mode 100644 index 0000000000..aec6735502 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +import { HeroButtonComponent } from './heroes/shared/hero-button/hero-button.component'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + directives: [HeroButtonComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-14/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-14/app/app.component.ts new file mode 100644 index 0000000000..ac06545cd5 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-14/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { ToastComponent } from './shared/toast/toast.component'; + +@Component({ + selector: 'sg-app', + template: ``, + directives: [ToastComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-15/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-15/app/app.component.ts new file mode 100644 index 0000000000..cb8cf26877 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-15/app/app.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; + +import { HeroListComponent } from './heroes/hero-list/hero-list.component'; +import { HeroService } from './heroes/shared'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroListComponent], + providers: [HeroService] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-15/app/heroes/shared/index.ts b/public/docs/_examples/style-guide/ts/05-15/app/heroes/shared/index.ts index 330dbe676c..27516fdedd 100644 --- a/public/docs/_examples/style-guide/ts/05-15/app/heroes/shared/index.ts +++ b/public/docs/_examples/style-guide/ts/05-15/app/heroes/shared/index.ts @@ -1,3 +1,3 @@ // #docregion -export * from './hero.model.ts'; -export * from './hero.service.ts'; +export * from './hero.model'; +export * from './hero.service'; diff --git a/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts new file mode 100644 index 0000000000..297fb5b74d --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +import { HeroComponent } from './heroes/hero.component'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + directives: [HeroComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-17/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-17/app/app.component.ts new file mode 100644 index 0000000000..e9437befb4 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/05-17/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { HeroListComponent } from './heroes/hero-list/hero-list.component'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroListComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/05-17/app/heroes/hero-list/hero-list.component.ts b/public/docs/_examples/style-guide/ts/05-17/app/heroes/hero-list/hero-list.component.ts index f78deda2bf..8570544a36 100644 --- a/public/docs/_examples/style-guide/ts/05-17/app/heroes/hero-list/hero-list.component.ts +++ b/public/docs/_examples/style-guide/ts/05-17/app/heroes/hero-list/hero-list.component.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion import { Component } from '@angular/core'; @@ -20,6 +21,13 @@ export class HeroListComponent { heroes: Hero[]; totalPowers: number; + // #enddocregion example + // testing harness + constructor() { + this.heroes = []; + } + + // #docregion example get avgPower() { return this.totalPowers / this.heroes.length; } diff --git a/public/docs/_examples/style-guide/ts/06-01/app/app.component.html b/public/docs/_examples/style-guide/ts/06-01/app/app.component.html index 82b7c0a173..2ccf87d0f5 100644 --- a/public/docs/_examples/style-guide/ts/06-01/app/app.component.html +++ b/public/docs/_examples/style-guide/ts/06-01/app/app.component.html @@ -1,2 +1,2 @@ -
Bombasta
+
Bombasta
diff --git a/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts new file mode 100644 index 0000000000..bd1374520d --- /dev/null +++ b/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +import { HighlightDirective } from './shared/highlight.directive'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + directives: [HighlightDirective] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/06-03/app/app.component.ts b/public/docs/_examples/style-guide/ts/06-03/app/app.component.ts new file mode 100644 index 0000000000..dbc24dfc2d --- /dev/null +++ b/public/docs/_examples/style-guide/ts/06-03/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { ValidatorDirective } from './shared/validate.directive'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [ValidatorDirective] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/07-01/app/app.component.html b/public/docs/_examples/style-guide/ts/07-01/app/app.component.html new file mode 100644 index 0000000000..3c05329f3f --- /dev/null +++ b/public/docs/_examples/style-guide/ts/07-01/app/app.component.html @@ -0,0 +1,5 @@ +
    +
  • + {{hero.name}} +
    • +
diff --git a/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts new file mode 100644 index 0000000000..5c6491c86c --- /dev/null +++ b/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts @@ -0,0 +1,20 @@ +import { Component, OnInit } from '@angular/core'; + +import { HeroService } from './heroes/shared/hero.service'; +import { Hero } from './heroes/shared/hero.model'; + +@Component({ + moduleId: module.id, + selector: 'sg-app', + templateUrl: 'app.component.html', + providers: [HeroService] +}) +export class AppComponent implements OnInit { + heroes: Hero[]; + + constructor(private heroService: HeroService) { } + + ngOnInit() { + this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes); + } +} diff --git a/public/docs/_examples/style-guide/ts/07-04/app/app.component.ts b/public/docs/_examples/style-guide/ts/07-04/app/app.component.ts new file mode 100644 index 0000000000..608d7cf403 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/07-04/app/app.component.ts @@ -0,0 +1,19 @@ +// #docregion +import { Component } from '@angular/core'; + +import { HeroArena, HeroService, Hero } from './heroes/shared'; + +@Component({ + selector: 'toh-app', + template: '
{{heroes | json}}
', + providers: [HeroArena, HeroService] +}) +export class AppComponent { + heroes: Hero[] = []; + + constructor(private heroArena: HeroArena) { } + + ngOnInit() { + this.heroArena.getParticipants().subscribe(heroes => this.heroes = heroes); + } +} diff --git a/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/hero-arena.service.ts b/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/hero-arena.service.ts index 7b08875fdc..42bc51f9e9 100644 --- a/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/hero-arena.service.ts +++ b/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/hero-arena.service.ts @@ -1,3 +1,4 @@ +// #docplaster // #docregion import { Injectable } from '@angular/core'; import { Http } from '@angular/http'; @@ -10,5 +11,11 @@ export class HeroArena { constructor( private heroService: HeroService, private http: Http) {} + // #enddocregion example + // test harness + getParticipants() { + return this.heroService.getHeroes(); + } + // #docregion example } // #enddocregion example diff --git a/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/index.ts b/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/index.ts index 27516fdedd..e8ba54b540 100644 --- a/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/index.ts +++ b/public/docs/_examples/style-guide/ts/07-04/app/heroes/shared/index.ts @@ -1,3 +1,4 @@ // #docregion export * from './hero.model'; export * from './hero.service'; +export * from './hero-arena.service'; diff --git a/public/docs/_examples/style-guide/ts/09-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/09-01/app/app.component.ts new file mode 100644 index 0000000000..089468ba0a --- /dev/null +++ b/public/docs/_examples/style-guide/ts/09-01/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +import { HeroButtonComponent } from './heroes/shared/hero-button/hero-button.component'; + +@Component({ + selector: 'sg-app', + template: '', + directives: [HeroButtonComponent] +}) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/app/app.component.html b/public/docs/_examples/style-guide/ts/app/app.component.html new file mode 100644 index 0000000000..0680b43f9c --- /dev/null +++ b/public/docs/_examples/style-guide/ts/app/app.component.html @@ -0,0 +1 @@ + diff --git a/public/docs/_examples/style-guide/ts/app/app.component.ts b/public/docs/_examples/style-guide/ts/app/app.component.ts new file mode 100644 index 0000000000..33448ba587 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/app/app.component.ts @@ -0,0 +1,65 @@ +import { Component } from '@angular/core'; +import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated'; + +import { AppComponent as S0101 } from '../01-01/app/app.component'; +import { AppComponent as S0207 } from '../02-07/app/app.component'; +import { AppComponent as S0208 } from '../02-08/app/app.component'; +import { AppComponent as S0301 } from '../03-01/app/app.component'; +import { AppComponent as S0302 } from '../03-02/app/app.component'; +import { AppComponent as S0303 } from '../03-03/app/app.component'; +import { AppComponent as S0304 } from '../03-04/app/app.component'; +import { AppComponent as S0305 } from '../03-05/app/app.component'; +import { AppComponent as S0306 } from '../03-06/app/app.component'; +import { AppComponent as S0410 } from '../04-10/app/app.component'; +import { AppComponent as S0414 } from '../04-14/app/app.component'; +import { AppComponent as S0502 } from '../05-02/app/app.component'; +import { AppComponent as S0503 } from '../05-03/app/app.component'; +import { AppComponent as S0504 } from '../05-04/app/app.component'; +import { AppComponent as S0512 } from '../05-12/app/app.component'; +import { AppComponent as S0513 } from '../05-13/app/app.component'; +import { AppComponent as S0514 } from '../05-14/app/app.component'; +import { AppComponent as S0515 } from '../05-15/app/app.component'; +import { AppComponent as S0516 } from '../05-16/app/app.component'; +import { AppComponent as S0517 } from '../05-17/app/app.component'; +import { AppComponent as S0601 } from '../06-01/app/app.component'; +import { AppComponent as S0603 } from '../06-03/app/app.component'; +import { AppComponent as S0701 } from '../07-01/app/app.component'; +import { AppComponent as S0703 } from '../07-03/app/app.component'; +import { AppComponent as S0704 } from '../07-04/app/app.component'; +import { AppComponent as S0901 } from '../09-01/app/app.component'; + +@Component({ + selector: 'my-app', + templateUrl: 'app/app.component.html', + directives: [ROUTER_DIRECTIVES] +}) +@RouteConfig([ + { path: '/01-01', name: '01-01', component: S0101 }, + { path: '/02-07', name: '02-07', component: S0207 }, + { path: '/02-08', name: '02-08', component: S0208 }, + { path: '/03-01', name: '03-01', component: S0301 }, + { path: '/03-02', name: '03-02', component: S0302 }, + { path: '/03-03', name: '03-03', component: S0303 }, + { path: '/03-04', name: '03-04', component: S0304 }, + { path: '/03-05', name: '03-05', component: S0305 }, + { path: '/03-06', name: '03-06', component: S0306 }, + { path: '/04-10', name: '04-10', component: S0410 }, + { path: '/04-14', name: '04-14', component: S0414 }, + { path: '/05-02', name: '05-02', component: S0502 }, + { path: '/05-03', name: '05-03', component: S0503 }, + { path: '/05-04', name: '05-04', component: S0504 }, + { path: '/05-12', name: '05-12', component: S0512 }, + { path: '/05-13', name: '05-13', component: S0513 }, + { path: '/05-14', name: '05-14', component: S0514 }, + { path: '/05-15', name: '05-15', component: S0515 }, + { path: '/05-16', name: '05-16', component: S0516 }, + { path: '/05-17', name: '05-17', component: S0517 }, + { path: '/06-01', name: '06-01', component: S0601 }, + { path: '/06-03', name: '06-03', component: S0603 }, + { path: '/07-01', name: '07-01', component: S0701 }, + { path: '/07-03', name: '07-03', component: S0703 }, + { path: '/07-04', name: '07-04', component: S0704 }, + { path: '/09-01', name: '09-01', component: S0901 }, + +]) +export class AppComponent { } diff --git a/public/docs/_examples/style-guide/ts/app/hero-data.ts b/public/docs/_examples/style-guide/ts/app/hero-data.ts new file mode 100644 index 0000000000..001af65e85 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/app/hero-data.ts @@ -0,0 +1,11 @@ +export class HeroData { + createDb() { + let heroes = [ + { id: '1', name: 'Windstorm' }, + { id: '2', name: 'Bombasto' }, + { id: '3', name: 'Magneta' }, + { id: '4', name: 'Tornado' } + ]; + return {heroes}; + } +} diff --git a/public/docs/_examples/style-guide/ts/app/main.ts b/public/docs/_examples/style-guide/ts/app/main.ts new file mode 100644 index 0000000000..63de673c81 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/app/main.ts @@ -0,0 +1,15 @@ +import { bootstrap } from '@angular/platform-browser-dynamic'; +import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; +import { XHRBackend, HTTP_PROVIDERS } from '@angular/http'; +import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api/core'; +import 'rxjs/add/operator/map'; + +import { HeroData } from './hero-data'; +import { AppComponent } from './app.component'; + +bootstrap(AppComponent, [ + ROUTER_PROVIDERS, + HTTP_PROVIDERS, + { provide: XHRBackend, useClass: InMemoryBackendService }, + { provide: SEED_DATA, useClass: HeroData } + ]); diff --git a/public/docs/_examples/style-guide/ts/index.html b/public/docs/_examples/style-guide/ts/index.html index 820bf59a96..44a280de44 100644 --- a/public/docs/_examples/style-guide/ts/index.html +++ b/public/docs/_examples/style-guide/ts/index.html @@ -17,6 +17,7 @@ + diff --git a/public/docs/_examples/style-guide/ts/systemjs.custom.js b/public/docs/_examples/style-guide/ts/systemjs.custom.js new file mode 100644 index 0000000000..4909a1d1a2 --- /dev/null +++ b/public/docs/_examples/style-guide/ts/systemjs.custom.js @@ -0,0 +1,44 @@ +(function(global) { + // extra local packages + var packageNames = [ + '01-01', + '02-07', + '02-08', + '03-01', + '03-02', + '03-03', + '03-04', + '03-05', '03-05/app/shared', '03-05/app/shared/spinner', '03-05/app/shared/toast', + '03-06', '03-06/app/shared', '03-06/app/shared/spinner', '03-06/app/shared/toast', + '04-10', '04-10/app/shared', '04-10/app/+heroes', '04-10/app/shared/spinner', '04-10/app/shared/toast', + '04-10/app/shared/filter-text', '04-10/app/shared/modal', '04-10/app/shared/nav', + '04-14', + '05-02', + '05-03', + '05-04', + '05-12', + '05-13', + '05-14', + '05-15', '05-15/app/heroes/shared', + '05-16', + '05-17', + '06-01', + '06-03', + '07-01', + '07-03', + '07-04', '07-04/app/heroes/shared', + '09-01' + ]; + + var packages = {}; + packageNames.forEach(function(pkgName) { + packages[pkgName] = { main: 'index.js', defaultExtension: 'js' }; + }); + + var config = { + packages: packages + } + + System.config(config); + +})(this); From 9f5113b1bfeffff63c8c22ceed7c9d9343c16447 Mon Sep 17 00:00:00 2001 From: Foxandxss Date: Sat, 21 May 2016 22:55:36 +0200 Subject: [PATCH 05/26] chore: update README with more e2e explanations closes #1462 --- README.md | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 2ee11b04d9..5e1c55b7bd 100644 --- a/README.md +++ b/README.md @@ -98,9 +98,14 @@ Also, open any `plunkr.no-link.html` to see the code execute in plunker ### Sample end-to-end tests -All samples should be covered to some degree by end-to-end tests. +All samples should be covered to some degree by end-to-end tests: +- `gulp run-e2e-tests` to run all TypeScript and JavaScript tests +- `gulp run-e2e-tests --lang=dart` to run all Dart tests +- `gulp run-e2e-tests --lang=all` to run TypeScript, JavaScript, and Dart tests +- `gulp run-e2e-tests --filter=quickstart` to filter the examples to run, by name +- `gulp run-e2e-tests --fast` to ignore npm install, webdriver update and boilerplate copy -Run them yourself: `gulp run-e2e-tests`. +Any combination of options is possible. ## Technology Used From 81ebdfb8effb8bc7f5d0fc8ac4fee9788abe08cb Mon Sep 17 00:00:00 2001 From: Foxandxss Date: Sat, 21 May 2016 18:36:27 +0200 Subject: [PATCH 06/26] docs: add strong advice on node and npm versions --- public/docs/ts/latest/guide/npm-packages.jade | 14 +++++++++++--- public/docs/ts/latest/quickstart.jade | 5 +++++ 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/public/docs/ts/latest/guide/npm-packages.jade b/public/docs/ts/latest/guide/npm-packages.jade index 4997eafd28..fa7b402a26 100644 --- a/public/docs/ts/latest/guide/npm-packages.jade +++ b/public/docs/ts/latest/guide/npm-packages.jade @@ -5,9 +5,17 @@ include ../_util-fns These packages are maintained and installed with the Node Package Manager (npm). .l-sub-section :marked - Don't have npm? - Get it now - because we're going to use it now and repeatedly throughout this documentation. + Node.js and npm are essential to Angular 2 development. + + + Get it now if it's not already installed on your machine + + **Verify that you are running node `v5.x.x` and npm `3.x.x`** + by running `node -v` and `npm -v` in a terminal/console window. + Older and newer versions produce errors. + + We recommend [nvm](https://github.com/creationix/nvm) for managing multiple versions of node and npm. + :marked We recommend a comprehensive starter-set of packages as specified in the `dependencies` and `devDependencies` sections of the QuickStart diff --git a/public/docs/ts/latest/quickstart.jade b/public/docs/ts/latest/quickstart.jade index 782e3d4713..1ee4a13068 100644 --- a/public/docs/ts/latest/quickstart.jade +++ b/public/docs/ts/latest/quickstart.jade @@ -49,6 +49,11 @@ block setup-tooling :marked Install **[Node.js® and npm](https://nodejs.org/en/download/)** if they are not already on your machine. + .l-sub-section + :marked + **Verify that you are running node `v5.x.x` and npm `3.x.x`** + by running `node -v` and `npm -v` in a terminal/console window. + Older and newer versions produce errors. block download-source .l-main-section From 60eeb0123ada0a4f66da103c2b43a797526c6b51 Mon Sep 17 00:00:00 2001 From: Ward Bell Date: Sat, 21 May 2016 16:26:54 -0700 Subject: [PATCH 07/26] docs(typings): update typings chapter + update lingering old package references --- public/docs/_examples/styleguide/js/app.js | 4 +- .../docs/_examples/styleguide/js/index.html | 14 +++++- public/docs/_examples/styleguide/ts/app.ts | 10 ++--- .../_includes/styleguide/_code-examples.jade | 14 +++--- .../guide/typescript-configuration.jade | 44 +------------------ public/docs/ts/latest/guide/upgrade.jade | 22 +++++----- 6 files changed, 37 insertions(+), 71 deletions(-) diff --git a/public/docs/_examples/styleguide/js/app.js b/public/docs/_examples/styleguide/js/app.js index a590cd7ed7..7ac0466c2c 100644 --- a/public/docs/_examples/styleguide/js/app.js +++ b/public/docs/_examples/styleguide/js/app.js @@ -4,11 +4,9 @@ var AppComponent = ng // #docregion component .Component({ - selector: 'my-app' - }) + selector: 'my-app', // #enddocregion // #docregion view - .View({ template: '

My First Angular 2 App

' }) // #enddocregion diff --git a/public/docs/_examples/styleguide/js/index.html b/public/docs/_examples/styleguide/js/index.html index 789b38144a..27c8930e59 100644 --- a/public/docs/_examples/styleguide/js/index.html +++ b/public/docs/_examples/styleguide/js/index.html @@ -6,9 +6,19 @@ - - + + + + + + + + + + foo2 diff --git a/public/docs/_examples/styleguide/ts/app.ts b/public/docs/_examples/styleguide/ts/app.ts index e6d0d92e49..68eb2b4348 100644 --- a/public/docs/_examples/styleguide/ts/app.ts +++ b/public/docs/_examples/styleguide/ts/app.ts @@ -1,13 +1,13 @@ // #docregion // #docregion import -import {Component, View, bootstrap} from '@angular/angular2'; +import { Component } from '@angular/core'; +import { bootstrap } from '@angular/platform-browser-dynamic'; + // #enddocregion // #docregion class-w-annotations @Component({ - selector: 'my-app' -}) -@View({ + selector: 'my-app', template: '

My First Angular 2 App

' }) // #docregion class @@ -18,4 +18,4 @@ class AppComponent { } // #docregion bootstrap bootstrap(AppComponent); // #enddocregion -// #enddocregion \ No newline at end of file +// #enddocregion diff --git a/public/docs/_includes/styleguide/_code-examples.jade b/public/docs/_includes/styleguide/_code-examples.jade index 47dbb56c1b..102b7694c1 100644 --- a/public/docs/_includes/styleguide/_code-examples.jade +++ b/public/docs/_includes/styleguide/_code-examples.jade @@ -113,11 +113,9 @@ include ../../../_includes/_util-fns var AppComponent = ng // #docregion component .Component({ - selector: 'my-app' - }) + selector: 'my-app', // #enddocregion component // #docregion view - .View({ template: '

My First Angular 2 App

' }) // #enddocregion view @@ -139,13 +137,13 @@ include ../../../_includes/_util-fns // #docplaster more code here // #docregion import,twoparts - import {Component, View, bootstrap} from 'angular2/angular2'; + import { Component } from '@angular/core'; + import { bootstrap } from '@angular/platform-browser-dynamic'; + // #enddocregion twoparts, import @Component({ - selector: 'my-app' - }) - @View({ - template: '

My first Angular 2 App

' + selector: 'my-app', + template: '

My first Angular 2 App

' }) class AppComponent { } diff --git a/public/docs/ts/latest/guide/typescript-configuration.jade b/public/docs/ts/latest/guide/typescript-configuration.jade index affa2b2928..a2454e98ce 100644 --- a/public/docs/ts/latest/guide/typescript-configuration.jade +++ b/public/docs/ts/latest/guide/typescript-configuration.jade @@ -76,7 +76,7 @@ a(id="typings") Many libraries include their definition files in their npm packages where both the TypeScript compiler and editors can find them. Angular is one such library. - Peek into the `node_modules/angular2/` folder of any Angular application to see several `...d.ts` files that describe parts of Angular. + Peek into the `node_modules/@angular/core/` folder of any Angular application to see several `...d.ts` files that describe parts of Angular. **We need do nothing to get *typings* files for library packages which include *d.ts* files — as all Angular packages do.** @@ -121,7 +121,7 @@ code-example(format=""). The following command installs the typings file for the Jasmine test library and updates the `typings.config` so we that we get it automatically the next time. code-example(format=""). - npm run typings -- install jasmine --ambient --save + npm run typings -- install jasmine --global --save .l-sub-section :marked The [–– option](https://docs.npmjs.com/cli/run-script) is important; @@ -129,43 +129,3 @@ code-example(format=""). Learn about the features of the *typings* tool at its [site on github](https://github.com/typings/typings/blob/master/README.md). -:marked - ### Typing file collisions - - The TypeScript compiler does not tolerate redefinition of a type. For example, it throws an error if it's given two definitions for - the `Promise` type. - - Double definitions are common. In fact, the `typings` tool deliberately creates - duplicate sets of typings (for reasons best explained elsewhere). - Look in the project structure for the *typings folder* where we should find something like: -.filetree - .file typings - .children - .file browser - .children - .file ambient - .children - .file core-js - .children - .file index.d.ts - .file ... - - .children - .file main - .children - .file ambient - .children - .file core-js - .children - .file index.d.ts - .file ... - .children - .file browser.d.ts - .file main.d.ts -:marked - The `core-js` typings are duplicated and the `browser.d.ts` and `main.d.ts` have overlapping content. - - We must tell the compiler to ignore one or the other. - We removed the `main` set from consideration in the `exclude` section of our `tsconfig.json` file: -+makeJson('quickstart/ts/tsconfig.1.json', {paths: 'exclude'}, 'tsconfig.json (exclude)')(format=".") -:marked diff --git a/public/docs/ts/latest/guide/upgrade.jade b/public/docs/ts/latest/guide/upgrade.jade index 95ee9314b9..a58d298998 100644 --- a/public/docs/ts/latest/guide/upgrade.jade +++ b/public/docs/ts/latest/guide/upgrade.jade @@ -864,12 +864,12 @@ code-example(format=""). project, which contains metadata about the type definitions we've installed: code-example(format=""). - npm run typings install jquery -- --save --ambient - npm run typings install angular -- --save --ambient - npm run typings install angular-route -- --save --ambient - npm run typings install angular-resource -- --save --ambient - npm run typings install angular-mocks -- --save --ambient - npm run typings install jasmine -- --save --ambient + npm run typings install jquery -- --save --global + npm run typings install angular -- --save --global + npm run typings install angular-route -- --save --global + npm run typings install angular-resource -- --save --global + npm run typings install angular-mocks -- --save --global + npm run typings install jasmine -- --save --global :marked In `index.html`, let's now enable SystemJS. Add a couple of `