/vptypes

Vue3 Prop Types definitions

Primary LanguageTypeScriptMIT LicenseMIT

VpTypes

npm vue types GitHub license

Prop type definitions for Vue.js. Compatible with both Vue 3.0

Installation

yarn add vptypes
import VpTypes from 'vptypes'

Example

props: {
  separator: VpTypes.string()
}

///////////////[ type ]///////////////////
props: Readonly<{
    separator?: string | undefined;
}>

def

props: {
  separator: VpTypes.string().def('/'),
},

///////////////[ type ]///////////////////
props: Readonly<{
    separator: string;
}>

isRequired

props: {
  separator: VpTypes.string().isRequired,
},

///////////////[ type ]///////////////////
props: Readonly<{
    separator: string;
}>

screenshots:

def params type check:

props type check:

Support types:

  • VpTypes.string()

  • VpTypes.number()

  • VpTypes.bool()

  • VpTypes.symbol()

  • VpTypes.object<T extends any = Record<string, unknown>>()

  • VpTypes.array<T extends any[]>()

  • VpTypes.func<T extends (...args: any) => any>()

  • VpTypes.integer()

  • VpTypes.hexColor()

    props: {
      textColor: VpTypes.hexColor().def('#303133'),
    }
    
    ///////////////[ type ]///////////////////
    props: Readonly<{
      textColor: `#${string}`;
    }
  • VpTypes.oneOfString<T extends string[]>(list: T)

    props: {
      type: VpTypes.oneOfString(['success', 'warning', 'info', 'error']).def('info'),
    }
    
    ///////////////[ type ]///////////////////
    props: Readonly<{
      type: "success" | "warning" | "info" | "error";
    }
  • VpTypes.oneOfType<T extends Array<VPropOptions>(list: T)

    props: {
      value: VpTypes.oneOfType([VpTypes.string(), VpTypes.number()]).isRequired,
    }
    
    ///////////////[ type ]///////////////////
    props: Readonly<{
        value: string | number;
    }
  • VpTypes.any()