在本地导入库，在全局上调用库函数进行验证

Question

我是Vue.js的新手。我对使用libphonenumber-js和vee-validate集成有疑问。

当我检查libphonenumber-js的文档时，如果需要验证电话号码，则需要在组件上使用以下方法。

import {isValidNumber} from "libphonenumber-js";
isValidNumber(/*input phone number*/); /*only return true or false*/

我希望使用vee-validate填写表格，并有一个问题要允许用户键入手机。

我研究了vee-validate对创建的vue的扩展。它可以创建自定义规则。

以下代码可以在本地组件上使用：

export default{
    /* others above */
    created: function(){
        this.$validator.extend("phone", {
            getMessage: (field) => "phone format wrong: " + field,
            validate: (input, args) => {
                return isValidNumber(input);
            }
        });
    }
}

但是我的项目在 main.js 上设置了所有自定义规则，通常我会这样：

new Vue({
    /* somethings */
    created: function(){
        VeeValidate.Validator.extend("gender", {
            getMessage: (field) => "please select: " + field,
            validate: (input, args) => {
                if(input == "MR" || input == "MS"){
                    return true;
                }else{
                    return false;
                }
            }
        });
    }
});

为了将来易于维护，我希望在 main.js 上使用所有vee-validate自定义规则设置的代码，请您帮助我如何将return isValidNumber(input)传递给全局？

我也做了codesandbox来向您展示测试。如果可以的话，请分叉。