• tsconfig编译属性isolatedModules的作用


    场景

    当我们的 .ts 文件中没有 import or export

    // 假设这是一个 a.ts 文件
    const a = 1;
    
    • 1
    • 2

    会出现如下报错

    TS1208: 'd.ts' cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' statement to make it a module.
    
    • 1

    如何解决

    这时候我们在,这个文件加一个 export {} 即可解决

    // 假设这是一个 a.ts 文件
    const a = 1;
    
    export {}
    
    • 1
    • 2
    • 3
    • 4

    为什么会有这个报错

    当我们的 tsconfig.json 中的 isolatedModules 设置为 true 时,如果某个 ts 文件中没有一个
    import or export 时,ts 则认为这个模块不是一个 ES Module 模块,它被认为是一个全局的脚本,
    这个时候在文件中添加任意一个 import or export 都可以解决这个问题。

    为什么要设置 isolatedModules 为 true

    假设有如下两个 ts 文件,我们在 a.ts 中导出了 Test 接口,在 b.ts 中引入了 a.ts 中的 Test 接口,
    然后又在 b.tsTest 给导出。

    // a.ts
    export interface Test {}
    
    • 1
    • 2
    // b.ts
    import { Test } from './a';
    
    export { Test };
    
    • 1
    • 2
    • 3
    • 4

    这会造成一个什么问题呢,如 Babelts 转义时,它会先将 ts 的类型给删除,但是当碰到 b.ts 文件时,
    Babel 并不能分析出 export { Test } 它到底导出的是一个类型还是一个实实在在的 js 方法或者变量,这时候 Babel 选择保留了 export
    但是 a.ts 文件在转换时可以很容易的判定它就导出了一个类型,在转换为 js 时,a.ts 中的内容将被清空,而 b.ts 中导出的 Test 实际上是从 a.ts
    中引入的,这时候就会产生报错。

    如何解决上述问题

    ts 提供了 import type or export type,用来明确表示我引入/导出的是一个类型,而不是一个变量或者方法,使用 import type 引入的类型,将在转换为 js 时被删除掉

    // b.ts
    import { Test } from './a';
    
    export type { Test }; 
    
    • 1
    • 2
    • 3
    • 4
  • 相关阅读:
    【最多等和不相交连续子序列】python实现-附ChatGPT解析
    开启AI大模型时代|「Transformer论文精读」
    笔训【day4】
    APP基本测试用例
    javacc之路6---扫描技巧
    办公环境保密管理制度
    (八)VBA常用基础知识:workbooks操作之打开workbook
    C#中关于 object,dynamic 一点使用心得
    【进阶C语言】编译与链接、预处理符号详解
    【路由交换技术】Cisco Packet Tracer基础入门教程(四)
  • 原文地址:https://blog.csdn.net/weixin_40013817/article/details/127125777