title: Vue2 with typescript, Property does not exist on type
body: <p>I have the below Vue component:</p>
  
  <pre><code>&lt;template&gt;
      &lt;v-snackbar bottom :color="color" v-model="snackbar"&gt;
          {{ msg }}
          &lt;v-btn flat @click.native="close()"&gt;Close&lt;/v-btn&gt;
      &lt;/v-snackbar&gt;
  &lt;/template&gt;
  
  &lt;script lang="ts"&gt;
      import Vue from 'vue';
      import VueEvent from '../../VueEvent';
  
      export default Vue.extend({
          data(): object {
              return {
                  snackbar: false,
                  msg: '',
                  color: '',
              };
          },
          created() {
              VueEvent.listen('snackbar', (data) =&gt; {
                  this.snackbar = true;
                  this.msg = data.msg;
                  this.color = data.color;
              });
              this.malert();
          },
          methods: {
              close(): void {
                  this.snackbar = false;
              }
          }
      });
  &lt;/script&gt;
  
  &lt;style scoped&gt;
  
  &lt;/style&gt;
  </code></pre>
  
  <p>When Typescript compiles I get the following error:</p>
  
  <pre><code>Property 'snackbar' does not exist on type 'CombinedVueInstance&lt;Vue, object, { close(): void; }, {}, Readonly&lt;Record&lt;never, any&gt;&gt;&gt;'.
      28 |         methods: {
      29 |             close(): void {
    &gt; 30 |                 this.snackbar = false;
         |                      ^
      31 |             }
      32 |         }
      33 |     });
  </code></pre>
  
  <p>Does anyone know how I can solve this problem, or explain why its happening?</p>