工程篇
2020-09-03 16:28:11 254 举报AI智能生成
typescript实战-工程篇
作者其他创作
大纲/内容
模块系统
ES6
导出
export
export default
导入
import
CommonJs
导出
exports
module.exports
导入
require
Node环境运行TS文件
ts-node
typescript
两种模块系统不要混用
兼容性写法
export =x
import x = require
命名空间
实现原理
立即执行函数构成的闭包
要点
局部变量对外不可见
导出成员对外可见
多个文件可共享同名命名空间
依赖关系 /// <reference path=""/'>
不要与模块混用
声明合并
含义: 多个具有相同名称的声明合并为一个声明
接口之间合并
非函数成员保证唯一性
函数成员为函数重载
重载顺序
函数参数为字符串字面量，提升到最顶端
接口之间，后面的接口靠前
接口内部，按书写顺序
命名空间之间合并
导出的成员不接重复定义或实现
命名空间与类合并
为类添加静态成员
命名空间与函数合并
为函数添加属性和方法
命名空间与枚举合并
为枚举添加属性和方法
TSCONFIG.JSON(主要配置)
文件选项
files
需要编译的单个文件列表
include
需要编译的文件或目录
exclude
需要排除的文件或目录
extends
配置文件继承
编译选项
incremental
增量编译
target
目标语言
module
目标模块系统
outFile
将多个依赖文件生成一个文件(amd模块)
lib
引用类库
allowJs
允许编译JS文件
outDir
输出目录
rootDir
输出目录
declaration
生成声明文件
sourceMap
生成sourceMap
noEmit
不输出文件
strict
alwaysStrict
注入 "use strict"
noImplicitAny
function(x){ }
strictNullChecks
let x:number =null
strictFunctionTypes
let a = (x:number)=>{}
let b =(y:number)={}
b =a
let b =(y:number)={}
b =a
strictPropertyInitialization
class C{
x:number
}
x:number
}
strictBindCallApply
function add(x:number,y:number){
return x+y
}
add.call(undefined,1,"2")
return x+y
}
add.call(undefined,1,"2")
noImplicitThis
class A{
a:number=1;
get A(){
return function(){
console.log(this.a)
}
}
}
a:number=1;
get A(){
return function(){
console.log(this.a)
}
}
}
esModuleInterop
允许 export = 导出,由import from 导入
allowUmdGlobalAccess
允许在模块找那个访问UMD全局变量
moduleResolution
模块解析策略
baseUrl
解析非相对模块的基地址
paths
路径映射，相对于baseUrl
rootDirs
将多个目录放在一个虚拟目录下，方便运行时访问
工程引用
composite
工程可以被引用和进行增量编译
declaration
必须开启
references
该工程依赖的工程
tsc --build 模式
单独构建一个工程,依赖工程也会被构建
编译工具
ts-loader
默认配置
transpileOnly
制作语言转换，不做类型检查
fork-ts-checker-webpack-plugin
独立的类型检查进程
awesome-typescript-loader
Babel
只做语言转换
@babel/preset-typescript
@babel/proposal-class-properties
@babel/proposal-object-rest-spread
tsc --watch 模式
类型检查
无法编译的typescript特性
namespace
不要使用
<typename>类型断言
改用 as typename
const enum
未来可期
export =
不要使用
代码检查工具
TSLint
官方弃用
ESLint
与typescript的AST不兼容
typescript-eslint
@typescript-eslint/parser
替换ESLint的解析器
@typescript-eslint/eslint-plugin
使用ESLint能识别一些特殊的typescript语言
VSCode ESLint插件
eslint.autoFixOnSave
babel-eslint
适用于babel体系
单元测试
tes-jest
有类型检查
babel-jest
无类型检查
0 条评论
下一页
