TypeScript08:在TS中使用模块化

前言:tsconfig.json中的配置

一、前端领域中的模块化标准

前端领域中的模块化标准有: ES6、commonjs、amd、umd、system、esnext 

二、 TS中如何书写模块化语句

 TS 中,导入和导出模块,统一使用 ES6 的模块化标准。

myModule.ts :

export const name = "kevin";export function sum(a: number, b: number) { return a + b;
}

index.ts :

import { sum, name } from "./myModule";console.log(sum(1, 2)); // 3
console.log(name); // kevin

注意:在导入模块时不要加后缀名。因为后缀名会编译到结果中,编译结果找不到 .ts 文件会报错。

三、编译结果中的模块化

1.在 tsconfig.json 中配置 module 参数为 es6 时:

结果:没有区别。 

2.在 tsconfig.json 中配置 module 参数为 commonjs 时: 

结果:导出的声明会变成 exports 的属性,默认的导出会变成 exports default 属性。导入时,会将整个对象拿到取属性值。

 "ues strict" js 中的严格模式,由于 ts 已经足够严格,因此可以通过配置 "noImplicitUseStrict": true 移除编译结果中的严格模式 "ues strict"

由于选项 "noImplicitUseStrict" 已弃用,将停止在 TypeScript 5.5 中运行。因此需要配置 "ignoreDeprecations": "5.0" 来忽略警告,5.0表示忽略5.0版本的警告。

四、解决默认导入的错误

当导入 nodejs 的模块时,由于模块不是基于 ts 开发的,导出使用的是 module.export = {} ,所以会报错模块没有默认导出。

解决方法1:不使用默认导入,改为具名导入。

解决方法2:导入所有声明

解决方法3: tsconfig.json 中配置 "esModuleInterop": true ,启用 es 的模块化标准交互非 es 模块导出。

编译结果中生成一个辅助函数,导入默认模块。判断模块导出方式是否为 es 导出,如果不是,为模块增加一个 default 属性。

 tsconfig.json 中的其他配置: "noEmitOnError": true, // 配置编译失败是否生成编译结果

五、如何在TS中书写commonjs模块化代码 

不建议使用。 

 1.方法一:使用这种方式获取不到类型检查

 2.方法二:这里可以获取到类型检查

3. 方法三:方法二中使用 require 

六、模块解析

模块解析:应该从什么位置寻找模块。 

 TS 中,有两种模块解析策略:

  1. classic:经典
  2. node node 解析策略(唯一的变化是将 js 替换为 ts

 node 解析策略:

  • 相对路径:require("./xxx")
  • 非相对路径:require("xxx") 

 在 tsconfig.json 中配置 "moduleResolution": "node" 来配置模块化标准的解析方式为 node

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/506324.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

k8s-kubeapps图形化管理 21

结合harbor仓库 由于kubeapps不读取hosts解析,因此需要添加本地仓库域名解析(dns解析) 更改context为全局模式 添加repo仓库 复制ca证书 添加成功 图形化部署 更新部署应用版本 再次进行部署 上传nginx 每隔十分钟会自动进行刷新 在本地仓库…

云主机和传统主机到底有什么区别呢?

随着信息技术的快速发展,企业对IT基础设施的要求越来越高,许多问题等待解决:政府传统部署扩容升级麻烦、公司服务器维护周期长、建设和维护成本低等。运营成本高; 安全稳定性差、数据易丢失等问题亟待解决。 云主机的出现很大程度…

绘制一下包络线

clear clc close all % 生成衰减信号 % 生成衰减曲线带有随机信号 fs 50; % 采样率 t 0:1/fs:100; % 时间向量,总时长为5秒 frequency0.5; signal exp(-0.05* t).*sin(2*pi*frequency*t); % 衰减曲线带有随机信号 % 计算包络线 [upper_envelope, lower_…

6.5 共享数据

本节介绍Android的四大组件之一ContentProvider的基本概念和常见用法:首先说明如何使用内容提供器封装内部数据的外部访问接口,然后阐述如何使用内容解析器通过外部接口操作内部数据,最后叙述如何利用内容解析器读写联系人信息,以…

LVS+Keepalived高可用群集

一、Keepalived简介 Keepalived 软件起初是专为LVS负载均衡软件设计的,用来管理并监控LVS集群系统中各个服务节点的状态,后来又加入了可以实现高可用的VRRP功能。因此,Keepalived除了能够管理LVS软件外,还可以作为其他服务&…

为什么健康的测试过程至关重要?附checklist

目录 单元测试:质量保证的基础 单元测试的优点 有效单元测试的最佳实践 应对常见挑战 简化单元测试的工具和框架 项目和测试文档:使用地图导航 有效项目文件的组成部分 如何维护项目文件 构成测试过程的测试文档类型 测试基础设施:…

基于JAVA的快递投保管理系统 开源项目

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、系统设计2.1 软件2.2 布局2.3 技术框架 三、功能模块3.1 保险类型模块3.2 快递管理模块3.3 保险订单模块 四、系统展示五、核心代码5.1 查询快递5.2 查询快递保险5.3 新增快递保险5.4 快递投保5.5 查询保险订单 六、免责说明 一、摘…

Centos7:自动化配置vim | suoders信任列表添加普通用户

Centos7:自动化配置vim | suoders信任列表添加普通用户 一、vim 配置原理二、sudoers系统可信任列表中添加普通用户三、自动化配置vim四、缩进修改 一、vim 配置原理 在目录/etc下有一个vimrc文件,该文件是系统中公共的vim配置文件,对所有用户…

一文认识蓝牙(验证基于Aduino IDE的ESP32)

1、简介 蓝牙技术是一种无线通信的方式,利用特定频率的波段(2.4GHz-2.485GHz左右),进行电磁波传输,总共有83.5MHz的带宽资源。 1.1、背景 蓝牙(Bluetooth)一词取自于十世纪丹麦国王哈拉尔Haral…

Redis 面试题

Redis 基础 什么是 Redis? Redis (Remote Dictionary Server) 本质上是一个 Key-Value 类型的内存数据库,很像 memcached,整个数据库统统加载在内存当中进行操作,定期通过异步操作把数据库数据 flush 到硬盘上进行保存。因为是纯…

Java中使用Jsoup实现网页内容爬取与Html内容解析并使用EasyExcel实现导出为Excel文件

场景 Pythont通过request以及BeautifulSoup爬取几千条情话: Pythont通过request以及BeautifulSoup爬取几千条情话_爬取情话-CSDN博客 Node-RED中使用html节点爬取HTML网页资料之爬取Node-RED的最新版本: Node-RED中使用html节点爬取HTML网页资料之爬…

NOC2023软件创意编程(学而思赛道)python初中组决赛真题

目录 下载原文档打印做题: 软件创意编程 一、参赛范围 1.参赛组别:小学低年级组(1-3 年级)、小学高年级组(4-6 年级)、初中组。 2.参赛人数:1 人。 3.指导教师:1 人(可空缺)。 4.每人限参加 1 个赛项。 组别确定:以地方教育行政主管部门(教委、教育厅、教育局) 认…