TypeScript学习笔记（一）

1、创建简单工程

1）创建一个新目录：

mkdir projcd proj

2)在proj文件夹中在src文件夹下创建两个文件夹，经过编译器生成的文件放入dist目录

mkdir srcmkdir dist

3）初始化工程，入口文件使用main.js

npm init

4）安装依赖项，先全局安装TypeScript和Gulp，再安装typescript，gulp，gulp-typescript

npm install -g gulp-cli

npm install --save-dev typescript gulp gulp-typescript

5）实现helloworld

function hello(compiler: string){    console.log(`Hello from ${compiler}`);}hello("TypeScript");

6）在工程的根目录proj下新建一个tsconfig.json文件

{"files": ["src/main.ts"],"compilerOptions": {"noImplicitAny": true,"target": "es5"}}

新建gulpfile.js文件

var gulp = require("gulp");var ts = require("gulp-typescript");var tsProject = ts.createProject("tsconfig.json");gulp.task("default", function() {return tsProject.src().pipe(tsProject()).js.pipe(gulp.dest("dist"));});

7）测试应用

gulpnode dist/main.js

打印出Hello from TypeScript

2、向代码里添加模块

1）新建src/greet.ts文件：

export function sayHello(name: string){return `Hello from ${name}`;}

更改main.ts，从greet.ts导入sayHello

import {sayHello} from "./greet";console.log(sayHello("TypeScript"));

将greet.ts添加到tsconfig.json

{"files": ["src/main.ts","src/greet.ts"],"compilerOptions": {"noImplicitAny": true,"target": "es5"}}

2）执行gulp，执行