极简Typescript+Node.js 安装教程-白红宇

概述：此处有Typescript好处各种，Node.js好处各种，所以两者结合一下。

1. 安装环境

win10 64位node: v8.12.0npm: 6.1.0复制代码

项目构建

# 创建目录mkdir ts-node-examplecd ts-node-example# 初始化node项目npm init -ynpm i --save-dev ts-node复制代码

之后创建tsconfig.json配置文件，用来指定编译该项目的相关选项，该文件需在TypeScript项目的根目录下，类似于webpack的package.json配置。其内容为

{  // 编译选项,可以被忽略，这时编译器会使用默认值  "compilerOptions": {    // 目标代码类型    "target": "es5",    // 指定生成哪个模块系统代码    "module": "commonjs",    // 生成相应的.d.ts文件    "declaration": true,    // 编译后结果所在目录    "outDir": "build"  }}复制代码

tsconfig.json的；

建立TypeScript + Node.js 项目

全局安装typescript

npm i -g typescript// 创建src目录，用于放置.ts文件mkdir src复制代码

在src目录下，创建index.ts文件，内容为

console.log('Hello World!');复制代码

之后修改package.json

{    "name": "ts-node-example",    "version": "1.0.0",    "description": "",    "main": "index.js",    "scripts": {        // 添加compile        "compile": "tsc",        "test": "echo \"Error: no test specified\" && exit 1"    },    "keywords": [],    "author": "",    "license": "ISC",    "devDependencies": {        "ts-node": "^7.0.1"    }}复制代码

运行npm run compile

项目目录变为

├── build│   ├── index.d.ts│   └── index.js├── node_modules├── package.json├── package-lock.json├── src│   └── index.ts└── tsconfig.json复制代码

构建dev环境

监听src目录下.ts文件的变化，如果发生变化，重新加载。

npm i --save-dev nodemon// 局部安装typescriptnpm i --save-dev typescript复制代码

然后将ts-node并将其指向src的入口文件

{    "name": "ts-node-example",    "version": "1.0.0",    "description": "",    "main": "index.js",    "scripts": {        "compile": "tsc && node build/index.js",        // 添加 dev        "dev": "nodemon --exec ./node_modules/.bin/ts-node -- ./src/index.ts",        "test": "echo \"Error: no test specified\" && exit 1"    },    "keywords": [],    "author": "",    "license": "ISC",    "devDependencies": {        "nodemon": "^1.18.9",        "ts-node": "^7.0.1",        "typescript": "^3.2.2"    }}复制代码

运行npm run dev

构建TypeScript Module

在src目录下创建greeter.ts文件

├── build│   ├── index.d.ts│   └── index.js├── node_modules├── package.json├── package-lock.json├── src│   └── index.ts│   └── greeter.ts└── tsconfig.json复制代码

其内容为

export function Greeter(name: string): string {    return 'Hello there, ' + name + '!'}复制代码

在index.ts中引入，有两种引入方式

import { Greeter } from './lib/greeter'/* import action = require('./lib/greeter')const { Greeter } = action*/console.log(Greeter('Yang'));复制代码

总结一步步来吧，应该没啥问题，记得把.json里面的注释删掉就好。