(docs) Getting Started/ToH-pt1: update for alpha-42, no tsd, noImplicitAny:false

public/docs/_examples/gettingstarted/ts/package.json

@@ -4,22 +4,18 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "postinstall": "npm run tsd",
-    "tsd": "tsd link --config src/tsd.json && tsd reinstall -ro --config src/tsd.json",
     "tsc": "tsc -p src -w",
-    "start": "live-server --open=src",
+    "start": "live-server --open=src"
-    "test": "echo \"Error: no test specified\" && exit 1"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "angular2": "2.0.0-alpha.40",
+    "angular2": "2.0.0-alpha.42",
     "systemjs": "0.19.2"
   },
   "devDependencies": {
     "live-server": "^0.8.1",
-    "tsd": "^0.6.5",
     "typescript": "^1.6.2"
   }
 }

public/docs/_examples/gettingstarted/ts/src/app.ts

@@ -1,5 +1,5 @@
 // #docregion
-import {Component, View, bootstrap} from 'angular2/core';
+import {Component, bootstrap} from 'angular2/angular2';
 
 @Component({
 	selector: 'my-app',

public/docs/_examples/gettingstarted/ts/src/app/app.ts

@@ -1,5 +1,5 @@
 // #docregion
-import {Component, View, bootstrap} from 'angular2/core';
+import {Component, bootstrap} from 'angular2/angular2';
 
 @Component({
 	selector: 'my-app',

public/docs/_examples/gettingstarted/ts/src/index.1.html

@@ -6,7 +6,7 @@
     <title>Getting Started</title>
     <script src="https://code.angularjs.org/tools/system.js"></script>
     <script src="https://code.angularjs.org/tools/typescript.js"></script>
-    <script src="https://code.angularjs.org/2.0.0-alpha.40/angular2.dev.js"></script>
+    <script src="https://code.angularjs.org/2.0.0-alpha.42/angular2.dev.js"></script>
     <script>
       System.config({
         transpiler: 'typescript',

public/docs/_examples/gettingstarted/ts/src/tsconfig.json

@@ -6,6 +6,6 @@
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "removeComments": false,
-    "noImplicitAny": true
+    "noImplicitAny": false
   }
 }

public/docs/ts/latest/guide/gettingStarted.jade

@@ -155,13 +155,6 @@ include ../../../../_includes/_util-fns
     compile locally and push the generated JavaScript to the server. We'll need some tools for that.
 
 
-    * We are writing TypeScript because we want strong-typing and some information
-    about the APIs we're using. If we wrote `AppComponent` in a TypeScript-aware editor,
-    we saw lots of red squiggly lines complaining about our code and
-    we received no guidance about what `Component`, `View`, and `bootstrap` can do.
-    We'll want to load TypeScript definition files to improve our coding experience.
-
-
     * Downloading JavaScript libraries from the web is OK for demos but
     it slows our development. Every time our app reloads, it must refetch these libraries.
     Don't count on browser caching.
@@ -182,7 +175,6 @@ include ../../../../_includes/_util-fns
 
       1. Revise the application project structure for future growth
       1. Install a few tools and packages
-      1. Prepare for local TypeScript compilation
       1. Revise the **`index.html`** to use local library resources
       1. Compile the TypeScript locally and watch for changes
 
@@ -238,13 +230,10 @@ include ../../../../_includes/_util-fns
 
     >**system.js** - an open-source library that provides module loading.
 
-    We'll also install three development tools:
+    We'll also install two development tools:
 
     >**typescript** - the TypeScript compiler
 
-    >**tsd** - the [tsd package manager](https://www.npmjs.com/package/tsd "TSD Package Manager") so we can access
-    [TypeScript type definition files](http://definitelytyped.org/ "Definitely Typed")
-
     >**[live-server](https://www.npmjs.com/package/live-server "Live-server")** - the static file server that reloads the browser when files change.
     We may have loaded it earlier. We're doing it again
     locally in our project so we are no longer vulnerable to
@@ -255,8 +244,8 @@ include ../../../../_includes/_util-fns
     Enter these commands:
     ```
     npm init -y
-    npm i angular2@2.0.0-alpha.39 systemjs@0.19.2 --save --save-exact
+    npm i angular2@2.0.0-alpha.42 systemjs@0.19.2 --save --save-exact
-    npm i typescript tsd live-server --save-dev
+    npm i typescript live-server --save-dev
     ```
 
     These commands both *install* the packages and *create* an npm `package.json` that will
@@ -316,33 +305,6 @@ include ../../../../_includes/_util-fns
   :markdown
     ## Prepare for TypeScript Compilation
 
-    ### Add links to TypeScript definition files
-
-    We prefer writing TypeScript apps in editors that understand TypeScript,
-    such as [Visual Studio Code](https://code.visualstudio.com/) and
-    [Web Storm](https://www.jetbrains.com/webstorm/features/).
-    Such editors improve the development experience by checking type information and
-    displaying API documentation ("intellisense") based on TypeScript definition files (`.d.ts`).
-
-    The definition files we need are included in the npm packages we just installed.
-    We'll use the
-    [**tsd package manager**](https://www.npmjs.com/package/tsd "TSD Package Manager")
-    to generate an *aggregate TypeScript definition file*, **`tsd.d.ts`**,
-    that holds links to the type definition files in those packages.
-
-    In the ***root* folder** enter the following command
-    (one of the `npm` scripts we added a short while ago)
-
-  pre.prettyprint.lang-bash
-    code npm run tsd
-
-  :markdown
-    That produces a new **`src/typings`** folder with the **`tsd.d.ts`** file.
-
-    Now type-checking and intellisense light up automatically as we write our app
-    in the Visual Studio Code and Web Storm editors. Check your editor's documentation for
-    instructions on using the `tsd.d.ts` file.
-
     ### Add the TypeScript configuration file
 
     We'll add a configuration file named **`tsconfig.json`**
@@ -354,15 +316,8 @@ include ../../../../_includes/_util-fns
 
   .alert.is-helpful
     :markdown
-      When the `noImplicitAny` flag is `true`, the compiler demands that we supply type information
+      See the [TypeScript configuration appendix](#tsconfig) to learn more about
-      unless the compiler can infer the type. It won't allow an identifier to default to the `any` type.
+      this file and these settings.
-      This setting is a preference, not a mandate.
-
-      Many of us prefer `noImplicitAny` because we want the TypeScript compiler to enforce type-safety vigorously.
-      That's one of the reasons we are writing our app in TypeScript.
-      Other people set this flag to `false` because they prefer more relaxed type checking.
-      Folks new to TypeScript are sometimes overwhelmed by the rigor;
-      they too may set the flag to `false` .. while they learn.
 
 .l-main-section
   :markdown
@@ -374,8 +329,6 @@ include ../../../../_includes/_util-fns
     ├── src
     │    ├── app
     |    │    └── app.ts
-    │    ├── typings
-    │    │    └──tsd.d.ts
     │    ├── index.html
     │    └── tsconfig.json
     └── package.json
@@ -455,9 +408,6 @@ include ../../../../_includes/_util-fns
     * our application loads faster with libraries installed locally and
     we can develop offline if we wish.
 
-    * we added TypeScript definition files to enhance team
-    productivity and code maintainability.
-
     * we're pre-compiling our TypeScript.
 
     * we're running the compiler and live-server with commands that give us immediate feedback as we make changes.
@@ -466,4 +416,43 @@ include ../../../../_includes/_util-fns
     We're about to build a small application that demonstrates the great things
     we can build with Angular 2.
 
-    <!--TODO  Join us next on the [Tour of Heroes]. -->
+    <!--TODO: Join us on the [Tour of Heroes](./toh-pt1) -->
+
+
+<!-- Move this to the Style Guide when we have one -->
+.l-main-section
+  :markdown
+    <a id="tsconfig"></a>
+    ### Appendix: TypeScript configuration
+    We added a TypeScript configuration file (`tsconfig.js`) to our project to
+    guide the compiler as it generates JavaScript files.
+    Get details about `tsconfig.js` from the official
+    [TypeScript wiki](https://github.com/Microsoft/TypeScript/wiki/tsconfig.json).
+
+    We'd like a moment to discuss the `noImplicitAny` flag.
+    TypeScript developers disagree about whether it should be `true` or `false`.
+    There is no correct answer and we can change the flag later.
+    But our choice now can make a difference in larger projects so it merits
+    discussion.
+
+    When the `noImplicitAny` flag is `false`,
+    the compiler silently defaults the type of a variable to `any` if it cannot infer
+    the type based on how the variable is used. That's what we mean by "implicitly `any`".
+
+    When the `noImplicitAny` flag is `true` and the TypeScript compiler cannot infer
+    the type, it still generates the JavaScript files but
+    it also reports an error.
+
+    For this project and the other examples in this Developer Guide
+    we set the `noImplicitAny` flag to `false`.
+    Developers who prefer stricter type checking should set the `noImplicitAny` flag to `true`.
+    We can still set a variable's type to `any` if
+    that seems like the best choice. We'd be doing so explicitly after
+    giving the matter some thought.
+
+    If we set the `noImplicitAny` flag to `true`, we may get implicit index errors as well.
+    If we feel these are more annoying than helpful,
+    we can suppress them with the following additional flag.
+    ```
+    "suppressImplicitAnyIndexErrors":true
+    ```

public/docs/ts/latest/guide/toh-pt1.jade

@@ -77,8 +77,6 @@ include ../../../../_includes/_util-fns
         ├── src
         |    ├── app
         |    |    └── app.ts
-        |    ├── typings
-        |    |    └── tsd.d.ts
         |    ├── index.html
         |    └── tsconfig.json
         └── package.json
@@ -262,7 +260,7 @@ include ../../../../_includes/_util-fns
     Let’s first gain access to the `NgModel` directive class by importing it from Angular as shown below:
 
     ````
-    import {bootstrap, Component, View, NgModel} from 'angular2/core';
+    import {bootstrap, Component, NgModel} from 'angular2/angular2';
     ```
 
     Now tell the component that we will use the  `ng-model` directive in the template
@@ -300,7 +298,7 @@ include ../../../../_includes/_util-fns
 
     Let’s forget about importing `NgModel` and import the `FORM_DIRECTIVES` array instead:
     ```
-    import {bootstrap, Component, View, FORM_DIRECTIVES} from 'angular2/core';
+    import {bootstrap, Component, FORM_DIRECTIVES} from 'angular2/angular2';
     ```
     Now we tell the component that our template can use `FORM_DIRECTIVES`
     by updating the `directives` property of the `@Component` decorator.
@@ -333,7 +331,7 @@ include ../../../../_includes/_util-fns
     Here's the complete `AppComponent.ts` as it stands now:
 
   code-example(format="linenums").
-    import {bootstrap, Component, View, FORM_DIRECTIVES} from 'angular2/core';
+    import {bootstrap, Component, FORM_DIRECTIVES} from 'angular2/angular2';
 
     class Hero {
       id: number;
@@ -368,4 +366,3 @@ include ../../../../_includes/_util-fns
     We’ll learn more about how to retrieve lists, bind them to the
     template, and allow a user to select it in the next chapter.
     -->
-