Vue3+TS 解决 app.config.globalProperties 全局变量参数不存在问题

假设我们在src目录下有一个 utils文件夹，里面有个index.ts文件，定义了自己的一些工具方法，比如：

const printInfo = (msg: string) => {
   console.log(msg);
}

export default {
   printInfo
}

如果想在全局使用，首先肯定是在main.ts中添加：

import utils from './utils'
...
// 全局属性配置
app.config.globalProperties.$utils = utils
...

然后在某个vue文件中使用：

解决办法就是添加一个 {文件名称}.d.ts声明文件，添加全局挂载属性：

import { ComponentCustomProperties } from "@vue/runtime-core";

declare module '@vue/runtime-core' {
    interface ComponentCustomProperties {
        $utils: object; // 这里填类型
    }
}
// 必须导出，才能在其他文件中使用
export default ComponentCustomProperties;

备注：文件名称随意，可以放在src的任意目录下，ts文件已经自动导入了，但因为要编译打包，最好不要和同级目录中已存在的文件名称相同，像我就是改成：extend.d.ts，放在src目录下的，其他全局变量挂载也可以往上追加。