Vue.js: How to specify props in single file component?
<p>I'm defining a <a href="http://vuejs.org/guide/application.html#Single-File-Components" rel="noreferrer">single file component</a></p>

<p>I want to use <a href="http://vuejs.org/guide/components.html#Props" rel="noreferrer">props</a> option on that component.</p>

<p>But where can I add the code?</p>

<pre><code>&lt;template&gt;
  &lt;div class="hello"&gt;
    &lt;h1&gt;{{ msg }}&lt;/h1&gt;
  &lt;/div&gt;
&lt;/template&gt;

&lt;script&gt;
export default {
  data () {
    return {
      // note: changing this line won't causes changes
      // with hot-reload because the reloaded component
      // preserves its current state and we are modifying
      // its initial state.
      msg: 'Hello World!'
    }
  }
}
&lt;/script&gt;

&lt;!-- Add "scoped" attribute to limit CSS to this component only --&gt;
&lt;style scoped&gt;
h1 {
  color: #42b983;
}
&lt;/style&gt;
</code></pre>