2-1-13 TS 模块

什么是模块?

模块是一个程序包,包内的成员(函数、变量、类型)仅仅在包内可见,包外想要方位这些成员除非模块自己主动声明向包外提供。例如用`import/export` 语法。

Export

向模块外部提供成员

default Export

// @filename : hello.ts
export default function helloWorld() {
  console.log("Hello, world!");
}

外部引用方式 如下:

import hello from './hello.ts'
hello()

non-default export

// @filename: maths.ts
export var pi = 3.14;
export let squareTwo = 1.41;
export const phi = 1.61;
 
export class RandomNumberGenerator {}
 
export function absolute(num: number) {
  if (num < 0) return num * -1;
  return num;
}

可以这样引用:

import { pi, phi, absolute } from "./maths.js";
 
console.log(pi, phi);
console.log(absolute(phi))

别名

为了防止模块冲突,可以使用别名。

import { pi as π } from "./maths.js";
 
console.log(π);

Export类型

// @filename: animal.ts
export type Cat = { breed: string; yearOfBirth: number }
export interface Dog {}

可以用`import` 或者`import type` 来使用:

import {Cat} from './animal.ts'
import type {Cat} from './animal.ts	'

`import type` 显示告诉编译器你只需要类型信息。

import type {Foo} from './animal'
const foo = new Foo()
'Foo' cannot be used as a value because it was imported using 'import type'

TS的模块解析配置项

TS的配置项`module` 可以用来配置TS将模块编译成什么?可选项包括:

- ES6

- ES2015

- ES2020

- UMD

- AMD

- Commonjs

- SYSTEM

- ESNext

等等

另外可以配置`moduleResolution` 项来决定模块的加载算法,可以是:

- node

- classic

1

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值