Importing props in VueJs

component.js

// Instead of doing this in lots of components:
export default {
  props: {
    colorClass: {
      type: String,
      required: true,
      default: 'blue',
      validator: value => ['red', 'blue'].includes(value)
    }
  }

  // ...etc
}

// Since the prop definition is just an object you can extract that to prop definition file:
export const colorClass = {
  type: String,
  required: true,
  default: 'blue',
  validator: value => ['red', 'blue'].includes(value)
}

// But let's say you have different default requirements for different components...
// You could create a factory function:
export const colorClass = (color = 'blue') => {
  return {
    type: String,
    required: true,
    default: color,
    validator: value => ['red', 'blue'].includes(value)
  }
}

// Then in your component you can import the prop object:
import { colorClass } from 'Props'

export default {
  props: {
    colorClass,
  }
}

// Or import the factory function, creating a prop that defaults to red:
import { colorClass } from 'Props'

export default {
  props: {
    colorClass: colorClass('red'),
  }
}