TypeScript 学习笔记 之插件安装

关于类型定义文件的管理工具，经历了 tsd、typings 两代进化，现在官方推荐的方式是使用 npm 进行管理

1.安装之前，先用bower安装相应插件 例如安装CKEditor ： 

    bower install --help

    bower install --save ckeditor#full/4.5.11
    bower home ckeditor
    bower search ckeditor

     bower install ckeditor

    bower install angular-ui-router --save

2.升级TypeScript  确认版本号在 2.0 以上

$ npm uninstall -g typescript

$ npm install -g typescript

$ tsc -v

npm install --save-dev typescript

3.类型定义库

Github 上的开源项目 DefinitelyTyped 用于维护常见 JavaScript 库的类型定义。

通过 TypeSearch 搜索对应库的类型定义文件。

4.安装类型定义文件

以 angularjs 为例，在工程根目录下执行如下命令以安装类型定义文件

$ npm install @types/angular --save-dev

对应的类型定义文件将被安装在 工程根目录/node_modules/@types 目录下。

5.配置 tsconfig.json

工程根目录/src 下的 tsconfig.json 用于配置 TypeScript 编译选项。在使用 npm 进行类型定义文件管理时，它的配置如下

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "ES5",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "rootDir": "./",
        "outDir": "../www"
    },
    "exclude": [
        "bower_components",
        "components",
        "../www"
    ],
    "include": [
        "../node_modules/@types",
        "./"
    ]
}

在未配置  typeroots  的前提下，TypeScript 编译器会自动寻找引入  node_modules/@types  目录中的类型定义文件。更多信息请参考  tsconfig-json types typeroots and types

5.如果你用的 Netbeans  要升级TypeScript Editor 插件

匹配 TypeScript 2，Netbeans 插件也需升级。在 nbts 下载最新的 .nbm 插件并导入 Netbeans 即可。

以下是typings时代的安转方法，可以参考：

2、然后再安装：typescript 相应支持插件 

插件地址（包含绝大部分插件）：https://github.com/DefinitelyTyped/DefinitelyTyped

安装时要注意的事项：

先全局安装： npm install typings --global

让后cd 到项目typings 目录下，进行以下命令的操作

安装命令说明： typings install -h

Install：安装

typings install (with no arguments, in package directory)
typings install [=]

        Module name of the installed definition
    The location to read from (described below)

Valid Locations:
  [~][@][#]
  file:
  github:/[/][#]
  bitbucket:/[/][#]
  npm:[/]
  bower:[/]
  http(s):///

      The registry mirror: "npm", "bower", "env", "global", "lib" or "dt"
              When not specified, `defaultSource` in `.typingsrc` will be used.
        Path to a `.d.ts` file or `typings.json`
        A domain name (with optional port)
     A semver range (E.g. ">=4.0")
         The specific tag of a registry entry
   A git commit, tag or branch

Options:
  [--save|-S]       Persist to "dependencies"
  [--save-dev|-D]   Persist to "devDependencies"
  [--save-peer|-P]  Persist to "peerDependencies"
  [--global|-G]     Install and persist as a global definition
    [-SG]           Persist to "globalDependencies"
    [-DG]           Persist to "globalDevDependencies"
  [--production]    Install only production dependencies (omits dev dependencies)

Aliases: i, in

案例：

先全局安装 ：       npm install typings --global

一般情况：

typings install debug --save

特殊情况：

typings install env~atom --global --save

typings install dt~ckeditor --save-dev -G

typings install dt~ng-file-upload --save-dev -G

typings install dt~angular-ui-router --save-dev -G

Uninstall 移除：

typings uninstall  [--save|--save-dev|--save-peer] [--global]

Options:
  [--save|-S]       Remove from "dependencies"
  [--save-dev|-D]   Remove from "devDependencies"
  [--save-peer|-P]  Remove from "peerDependencies"
  [--global|-G]     Remove from the global version of dependencies
    [-SG]           Remove from "globalDependencies"
    [-DG]           Remove from "globalDevDependencies"



Aliases: r, rm, remove, un

案例：

typings remove ckeditor -D -G

typings remove atom  -G

Init

Initialize a new typings.json file. If you're currently using TSD, you can use  --upgrade  to convert  tsd.json  to  typings.json .

typings init

Options:
  [--upgrade]    Upgrade `tsd.json` to `typings.json`

List

typings list

Options:
  [--production] List only production dependencies (omit dev dependencies)

Aliases: la, ll, ls

Bundle

typings bundle --out 
Options:
  [--out|-o]   The bundled output file path
  [--global|-G]          Bundle as a global definition

Search

typings search [query]

Options:
  [--name]      Search for definitions by exact name (E.g. only "react")
  [--source]  The registry mirror (E.g. "npm", "bower", "env", "global", "dt", ...)
  [--offset]       Skip first "x" results (default: 0)
  [--limit]        Limit to "x" results (default: 20, max: 100)
  [--order]    Direction to sort results (default: "asc", enum: "asc" or "desc")
  [--sort]    Order results by a column (E.g. "versions", "name", ...)