title: VueJS Prop Validation Using Typescript Interface Type
body: <p>I have the following VueJS component (typescript, vue-property-decorator):</p>
  
  <pre><code>import {PropType} from 'vue';
  import {Component, Vue, Prop} from 'vue-property-decorator';
  import {buildRouteLink, Route} from 'my-config';
  
  @Component
  export default class Report extends Vue {
    // I've also tried Object as () =&gt; Route, which also doesn't work
    @Prop({type: Object as PropType&lt;Route&gt;, required: true})
    private route!: Route;
    private url: string = '';
    mounted() {
      this.url = buildRouteLink(this.route);
    }
  }
  </code></pre>
  
  <p>The issue is, if I mount the component like:</p>
  
  <pre><code>&lt;report :route="route"/&gt;
  </code></pre>
  
  <p>And pass the <code>route</code> property as a type that doesn't conform to the <code>Route</code> interface ( eg: <code>{foo: true}</code> ), I get no runtime validation error, only an error in <code>buildRouteLink()</code>, which expects <code>Route</code> fields to exist.</p>
  
  <p>The <code>Route</code> interface is simple:</p>
  
  <pre><code>interface Route {
    app: string;
    route: string;
  }
  </code></pre>
  
  <ul>
  <li><strong><code>typescript</code> version</strong>: 3.2.4</li>
  <li><strong><code>vue</code> version</strong>: 2.6.10</li>
  <li><strong><code>vue-property-decorator</code> version</strong>: 7.3.0</li>
  </ul>