在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
}
相关推荐
ttod_qzstudio3 小时前
Vue 3 的魔法:用 v-bind() 让 CSS 爱上 TypeScript 常量
css·vue.js·typescript
[seven]16 小时前
React Router TypeScript 路由详解:嵌套路由与导航钩子进阶指南
前端·react.js·typescript
_Kayo_19 小时前
TypeScript 学习笔记2
前端·javascript·typescript
[seven]1 天前
React Router TypeScript 路由详解:类型安全的路由配置与参数处理
安全·react.js·typescript
李子烨1 天前
吃饱了撑的突发奇想:TypeScript 类型能不能作为跑业务逻辑的依据?(纯娱乐)
前端·typescript
坐公交也用券1 天前
适用于vue3+pnpm项目自动化类型检查及构建的Python脚本
开发语言·javascript·python·typescript·自动化
LYFlied2 天前
TypeScript 常见面试问题
ubuntu·面试·typescript
前端不太难2 天前
RN + TypeScript 项目越写越乱?如何规范架构?
前端·javascript·typescript
JQ_Zhang2 天前
极致体验!一个小工具实现智能关键词高亮 (中英文混排/全字匹配)
typescript
yujunlong39192 天前
Redux Toolkit (RTK) + TypeScript
前端·typescript·react