在ts中定义全局和模块的变量和类型

说明

普通的.ts文件是局部的 只有.d.ts文件是全局的

全局

ts 复制代码
// xxx.d.ts
// 只能在文件顶部导入全局模块
import type { CSSProperties } from 'react'

// 将本文件声明为模块
export {}

// 在模块外的不会被导出 但是可以被模块内引用
type C = 1

// 拓展已有的全局模块
declare global {
   export const A = 1
   // export 写不写没影响
   type B = 2
   type D = C
}

不推荐的写法

老版本ts的语法 当时还没有模块 全在用namespace

ts 复制代码
const A = 1
type B = 2

模块

ts 复制代码
// xxx.d.ts
declare module 'A' {
  export const a = 1
}
ts 复制代码
// 其他文件
import {a} from 'A'

如果需要导入其他模块

ts 复制代码
// xxx.d.ts
// 不能在模块外部import 或 export

// 写在外面不会被视作模块的内容 可以被模块里引用
type B = string
declare module 'A' {
  // 可以导入全局模块 必须写在模块内部的顶部
  import { CSSProperties } from 'react'
  
  export type Style = CSSProperties
  // 写不写export 都可以 但export会使编辑器更好地处理引用
  type A = 1
  type B = B
}
相关推荐
烛阴7 小时前
【TS 设计模式完全指南】构建你的专属“通知中心”:深入观察者模式
javascript·设计模式·typescript
濮水大叔16 小时前
VonaJS多租户🔥居然可以同时支持共享模式和独立模式,太牛了🚀
typescript·node.js·nestjs
濮水大叔18 小时前
VonaJS多租户同时支持共享模式和独立模式
typescript·nodejs·nestjs
科技林总1 天前
【TS3】搭建本地开发环境
学习·typescript
tyro曹仓舒1 天前
彻底讲透as const + keyof typeof
前端·typescript
濮水大叔2 天前
Vona ORM分表全攻略
typescript·node.js·nestjs
Bruce-li__2 天前
前端开发利器:nvm、npm与pnpm全面解析与TypeScript/JavaScript选择指南
javascript·typescript·npm
Linsk2 天前
如何实现TypeScript级的polyfill自动引入
前端·typescript·前端工程化
路光.2 天前
统一配置管理根据不同域名展现不同信息或相近信息 Vue3类单例模式封装
前端·单例模式·typescript·vue3