typescript之typings（*.d.ts类型声明）

朱雀 2022-11-04 15:26 475阅读 0赞

参考微信小程序官方ts基础工程：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70][]

tsconfig.json

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70 1][]

类型引入之后，就可以在我们的ts代码中，直接调用 wx 相关方法，编译期不会报错，运行期必须在微信环境下！

// wx 通过 *.d.ts 类型声明， 相当于定义了“全局对象”，类似 window 对象
    
    /**
     * 拨号
     * @param phoneNumber
     */
    export const makePhoneCall = function (phoneNumber: string) {
        wx.makePhoneCall({
            phoneNumber,
        });
    };

引入node\_modules中的类型声明：

修改 typings/index.d.ts

/// <reference types="miniprogram-api-typings" />
    
    // wx 通过 *.d.ts 类型声明， 相当于定义了“全局对象”，类似 window 对象
    
    /**
     * 拨号
     * @param phoneNumber
     */
    export const makePhoneCall = function (phoneNumber: string) {
        wx.makePhoneCall({
            phoneNumber,
        });
    };

需要安装miniprogram-api-typings依赖包：npm i miniprogram-api-typings -D

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70 2][]

参考：

[https://www.tslang.cn/docs/handbook/declaration-files/consumption.html][https_www.tslang.cn_docs_handbook_declaration-files_consumption.html]

[https://www.tslang.cn/docs/handbook/tsconfig-json.html][https_www.tslang.cn_docs_handbook_tsconfig-json.html]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70]: /images/20221023/0c72edd1d67946db94a74430f489f76d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70 1]: /images/20221023/32612607d0bb49c9aaac5d2d18b0bed8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM3Mjc4MDU_size_16_color_FFFFFF_t_70 2]: /images/20221023/c21736c209e94d818ae17890f98c0620.png
[https_www.tslang.cn_docs_handbook_declaration-files_consumption.html]: https://www.tslang.cn/docs/handbook/declaration-files/consumption.html
[https_www.tslang.cn_docs_handbook_tsconfig-json.html]: https://www.tslang.cn/docs/handbook/tsconfig-json.html