Hi,我是Yoyo酱。
这是掘金小册Typescript 全面进阶指南的学习笔记。一起摸鱼学习啊哈哈哈,秉承 用输出倒逼输入,我决定:
- 在每篇文章中记录每节课的笔记
- 该系列完成后,在公司内部进行一次分享
一起来看最后成果吧!
day 1
前提概要
- 最佳学习路径:类型-语法-工程
搭建 TypeScript 的开发环境
本节课会学习的内容
- 插件以及配置项
- ts-node、ts-node-dev
- TypeScript Playground
插件
- TypeScript Importer 搜集项目内所有的类型定义,进行
自动补全 - Move TS 快速修改文件名和其引用
- ErrorLens 在ts代码旁边出现
红色的错误信息
针对vscode Settings的官方内置配置-工作区 搜索'typescript Inlay Hints',开启几个常用的配置
- Function Like Return Types,显示推导得到的函数返回值类型;
- Parameter Names,显示函数入参的名称;
- Parameter Types,显示函数入参的类型;
- Variable Types,显示变量的类型
ts-node
安装ts-node 和 typescript
npm i ts-node typescript -g
生成 tsconfig.json
tsc --init
快速验证
ts-node index.ts
使用命令行
--emit --compilerHost输出编译产物和sourcemap
ts-node-dev
作用:自动监听文件变更(基于node-dev和ts-node实现,共享TS编译进程)
npm i ts-node-dev -g
快速验证,跳过类型检查过程
ts-node-dev --respawn --transpile-only index.ts
TypeScript Playground
官方提供的 Playground,可以进行可视化配置tsconfig。
遗留问题:
1、ts-node怎么配置 alias 快速启动?
本节单词
- transpile 转译
- transpiler 转译器
- declare 声明,断言
资料参考: What is TypeScript