导入映射(实验性)

    导入映射控制 TypeScript/JavaScript 的导入行为,尤其是可指定对 裸说明符 的解析。

    通过编辑器顶部菜单栏的 项目 -> 项目设置 -> 脚本 中的 导入映射 项即可指定导入映射文件的路径。设置完成后,导入映射功能开启,使用的导入映射将从指定的文件中读取。

    若有一个模块被项目中所有的模块所使用,而开发者并不希望其他模块以相对路径的方式引用它,而是为它起一个别名,那么便可以选择使用导入映射。

    例如,某个模块真实的绝对路径为 ,我们希望所有模块可以以 import {} from 'foo'; 的方式来引用它,操作步骤如下:

    • "foo":指定我们要映射的模块名。
    • "./assets/lib/foo.ts":指定如何映射 "foo"。 是相对路径,导入映射中的所有相对路径都是相对于导入映射文件本身的位置的,因此 ./assets/lib/foo.ts 将解析为绝对路径 <项目>/assets/lib/foo.ts

    然后在任意模块中使用以下方式引用模块时,'foo' 都将解析为模块 <项目>/assets/lib/foo.ts

    导入映射还允许映射指定目录下的所有模块。

    例如,要映射项目 assets/lib/bar-1.2.3 目录下的所有模块,则导入映射的 json 文件如下所示:

    除了 "bar/" 指定的是我们要映射的目录,其余的与 别名映射 一致。

    这样项目中的模块都能以 的形式来引用目录 bar-1.2.3 中的模块。

    'bar/baz' 将解析为模块 <项目>/assets/lib/bar-1.2.3/baz.ts
    'bar/qux/quux' 将解析为模块 <项目>/assets/lib/bar-1.2.3/qux/quux.ts

    TypeScript 并不支持导入映射,在使用时可能会导致出现找不到模块的报错,所以我们需要通过额外的配置来告诉 TypeScript 类型检查器额外的模块解析信息。

    例如上述中的两个例子,可以在项目目录下的 tsconfig.json 文件中配置 字段(若没有该字段,可自行补上),如下所示:

    更多关于导入映射的功能,请参考 导入映射

    支持情况

    Cocos Creator 支持 Import Maps Draft Community Group Report, 12 January 2021 中的所有功能。