title: What's the difference between creating the Vue instance properties inside and outside the export default?
body: <p>So in Vuejs, what is the difference between the two below?</p>
  <ol>
  <li>Is it more advisable to do the first one?</li>
  <li>Is it advisable to use the second one for other properties (methods, computed, watch, etc)?</li>
  <li>What are the effects of using the second one for creating the properties?</li>
  </ol>
  <p>Thank you for any input!</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;template&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  
  export default {
      data() {
        return {
        .........
        }
      },
  
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script&gt;
  
  let data = {
      .....
  }
  
  export default {
    data() {
      return data
    },
        
   &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>