tsc 启动的ts文件可以在tsconfig.json里设置module的代码规范设置位AMD commonjs规范 或者umd 或者esm
定义一个全局变量文件的d.ts 文件可以 在tsconfig.json 里的types里指定去指定文件文件路径 (默认情况下打包器他会自己查找)
例如声明的类型全局类型文件
decalre 是全局声明 给全局变量用的
declare const a:number;
'types':['./src/env.d.ts']
同时要删除 files 属性 防止tsc 走files下文件路径 其他文件不会被打包查找。
全局声明的适用环境如下
- 打包后只生产js 没有类型，可以在开启配置中自动生成类型文件
- 我们使用了js包没有ts类型 需要自己编写，也可以引入
- 通过cdn外联了一个包也需要写声明文件
- 拓展全局属性的时候也需要写声明文件
有时候引入一个模块找不到声明 可以通过
decalre module "mitt"{
const on:(type,listender:(...args:any[])=>viod)=>viod;
}
还可以细分一下
decalre module "mitt"{
type Type =string;
type Listener=(...arg:any[])=>viod;
const on:(type:Type,listender:Listern)=>viod;
//可以自己选择哪些导出
export { Type,Listener}
}
然后日常实用可以导出
import mitt,{Type，Listener} from 'mitt'
上面是命中模块的
下面是命中文件的
例如以vue文件举个例子
到处文件
declare module "*vue"{
import type {DefineComponent} from 'vue'
const comp:DefineComponent;
export default commp
}
使用文件，导入一个值，这个值希望是有类型的
import comp from 'a.vue'
再以jpg跟css文件位例子
declare module '*.jpg'{
const str:string;
export default str
}
declare module "*.css"{
const str:string;
export default str
}
使用的时候
import jpg from 'a.jpg'
import css from a.css
这样可以拿到路径名
如果有人位模块编写好类型了，我们可以直接引用别人的
对全局接口进行拓展的时候一定要把全局声明的东西放全局声明的文件里不建议再单独文件下设置
注释的就是不应该搞得
//declare global{
interFace String{
mystr(perfix:string):this
}
//}
有时候项目的store需要注册在Window上 所以需要在全局文件下利用接口合并重新定义接口
declare interface Window{ store:object
}
使用的时候去第三方包以loadsh为例 先查找是否自己定义过的，如果定义过使用自己的，没有定义想上查找 node_nidules
-
打包器会默认招当前node_modules下的同名模块，看是否有此文件夹，有的花招packge.json下里的types里的路径
-
没有types 默认招模块下的index.d.ts
-
再没有查找node_modules下@types 是否有 同名模块，按照上述方式继续查找
tsconfig.json 里的types 数组是告诉打包器当前项目下，我用了哪些声明文件是列表
path 是告诉打包器怎么找对应引入包的路径方式,怎么找的
ts还有三斜线指令 引用其他声明文件
/// （自己写的用path 别人写的用type 或者 内置lib）
然后 export 导出，在导入别的文件
通过 declare 来重新写一些东西通过命名空间导出保护全局变量不受污染
ts还有装包拆包的概念
装包就是利用泛型加上函数把原来的简单对象编程复杂的poxy对象 拆包就是把复杂的边成简单的
