TypeScript08:在TS中使用模块化

news2024/11/16 11:50:22

前言: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.coloradmin.cn/o/1479792.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

喜迎乔迁,开启新章 ▏易我科技新办公区乔迁庆典隆重举行

2024年1月18日,易我科技新办公区乔迁庆典在热烈而喜庆的氛围中隆重举行。新办公区的投入使用,标志着易我科技将以崭新姿态迈向新的发展阶段。 ▲ 易我科技新办公区 随着公司业务的不断发展和壮大,为了更好地适应公司发展的需要,…

AI智能分析网关V4:抽烟/打电话/玩手机行为AI算法及场景应用

抽烟、打电话、玩手机是人们在日常生活中常见的行为,但这些行为在某些场合下可能会带来安全风险。因此,对于这些行为的检测技术及应用就变得尤为重要。今天来给大家介绍一下TSINGSEE青犀AI智能分析网关V4抽烟/打电话/玩手机检测算法及其应用场景。 将监控…

StarRocks实战——贝壳找房数仓实践

目录 前言 一、StarRocks在贝壳的应用现状 1.1 历史的数据分析架构 1.2 OLAP选型 1.2.1 离线场景 1.2.2 实时场景 1.2.3 StarRocks 的引入 二、StarRocks 在贝壳的分析实践 2.1 指标分析 2.2 实时业务 2.3 可视化分析 三、未来规划 3.1 StarRocks集群的稳定性 3…

免费音频剪辑

在数字时代,音频剪辑已成为许多职业和爱好者不可或缺的技能。无论是制作播客、教育视频、还是进行广告宣传,高质量的音频剪辑都能为作品增色不少。今天,我要为大家强烈安利一款免费且功能强大的音频剪辑工具,它绝对是你办公桌上不…

虚拟机上为AzureDevOps Server 创建用户

为DevOpsServer创建登录用户 背景虚拟机的本地用户和组去DevOps Server上添加本地用户 背景 我们有一台虚拟机,然后在上面安装了一台Azure DevOps Server,然后我们创建几个登录用户。 虚拟机的本地用户和组 首先我们登陆到虚拟机,然后我们…

HTML5:七天学会基础动画网页4

backgorund-size 值与说明 length(单位像素):设置背景图片高度和宽度,第一个值设置宽度,第二个值设置高度,如果只给出一个值,第二个是设置为auto。 percentage(百分比):以父元素的百分比来设置背景图像的宽度和高度&#xff0c…

SpringBoot 事务失效及其对应解决办法

简介 本文主要讲述Spring事务会去什么情况下失效及其解决办法 Spring 通过AOP 进行事务控制,如果操作数据库报异常,则会进行回滚;如果没有报异常则会提交事务;但是,如果Spring 事务失效,会导致数据缺失/重…

服务器git安装python包失败,如何手动下载github项目包并安装到虚拟环境中(简单易懂)

背景: 想要复现一个项目,建立好虚拟环境后,准备安装项目需要的包,故输入命令pip install -r requirements.txt requirements.txt如下图 其他包我都安装成功了,只有最后一个包失败了,是需要服务器git链接…

PFA溶样罐耐酸碱小型样品罐适用元素分析实验透明特氟龙消解瓶

PFA溶样罐,也叫PFA管形瓶、可溶性聚四氟乙烯溶样罐、消解瓶等,常用于地质地矿、地球化学、土壤微生物等样品分析消解实验,可搭配石墨消解仪、电热板使用。广泛适用于痕量分析、环境监测、重金属检测、半导体、新材料、新能源等。 规格参考&am…

【二叉搜索树】【递归】【迭代】Leetcode 700. 二叉搜索树中的搜索

【二叉搜索树】【递归】【迭代】Leetcode 700. 二叉搜索树中的搜索 二叉搜索树解法1 递归法解法2 迭代法 ---------------🎈🎈题目链接🎈🎈------------------- 二叉搜索树 二叉搜索树(Binary Search Tree&#xff…

IDEA开发环境的安装与编写第一个程序

1.下载 IDEA(全称IntelliJ IDEA)是用于Java程序开发的集成环境(也可用于其他语言),它在业界被公认是最好的Java开发工具之一,尤其在智能代码助手、代码自动提示、重构、J2EE支持、Ant、JUnit、CVS整合、代…

D365:LookUp

文章目录 前言一、复制onLookUp事件方法二、LookUp方法 前言 在Form的字段的onLookUp方法中,添加下拉框。 一、复制onLookUp事件方法 二、LookUp方法 [FormControlEventHandler(formControlStr(EcoResProductDetailsExtended, VyaKeyItemType_VyaMaterialSubCode…

独家揭秘!2024年最受欢迎的十大CRM系统排名公布!

过去的2023年是企业出海热潮的一年,是AI人工智能技术飞速发展的一年,同时也是CRM管理系统产品功能日趋强大的一年。经过一年的技术沉淀经验总结,展望2024有哪些顶级的CRM系统,本篇为您带来十大CRM系统排行榜。排名靠前的CRM系统有…

LeetCode刷题--- 乘积最大子数组

个人主页:元清加油_【C】,【C语言】,【数据结构与算法】-CSDN博客 个人专栏 力扣递归算法题 http://t.csdnimg.cn/yUl2I 【C】 ​​​​​​http://t.csdnimg.cn/6AbpV 数据结构与算法 ​​​http://t.csdnimg.cn/hKh2l 前言:这个专栏主要讲述动…

借助生成式 AI 提升鸿蒙 APP 开发体验?试试 AutoDev 新功能

生成式 AI 在软件研发和知识管理上,有着非常大的潜力,也因此这项技术被越来越多的企业所采用。而在一些新兴的技术上,诸如于鸿蒙操作系统,它带来了一些新 的理念、开发工具 DevEco Studio、新的语言 ArkTS、新的 UI 框架 ArkUI 等…

K8S中POD的控制器

一、Pod控制器及其功用 Pod控制器,又称之为工作负载(workload),是用于实现管理pod的中间层,确保pod资源符合预期的状态,pod的资源出现故障时,会尝试进行重启,当根据重启策略无效&am…

【IO流系列】ConvertStream 转换流

转换流 1. 概述2. 作用3. 字符编码和字符集3.1 字符编码3.2 字符集 4. InputStreamReader字符转换输入流4.1 构造方法4.2 代码示例 5. OutputStreamWriter字符转换输出流5.1 构造方法5.2 代码示例 6. 练习6.1 练习1:转换文件编码6.2 练习2:读取文件数据 …

CY8C42(1.PSoC4 Pioneer Kit开箱及基本使用)

1.开箱 最近了解到赛普拉斯有一种芯片,属于PSoC系列,与传统MCU不同,有点类似跨界芯片,于是就买来玩玩了,老实说用完还是很特别的,因为我没有用过FPGA,不确定是不是FPGA的开发流程(有…

Spring 学习记录

Spring 学习记录 1. Spring和SpringFrameWork1.1 广义的Spring2.1 狭义的Spring2.3 SpringFrameWork / Spring框架图 2. Spring IOC容器(即上图中的Core Container)2.1 相关概念 (IOC DI 容器 组件)2.2 Spring IOC容器的作用2.3 Spring IOC容器接口和具体实现类 3. Spring IOC …

p18 线性代数,行阶梯型矩阵

行阶梯型矩阵 行最简型矩阵