vue.jsの読み込み位置

Question

vue.jsをrailsに入れたのですが

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})
    <div id="app">
    {{ message }}
    </div>

だと動かず、

    <div id="app">
    {{ message }}
    </div>
var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

だと動きました。vue.jsはhtmlと指定しているidが読み込まれた後にjavascriptを読み込むの順番じゃないと動かないのでしょうか？

またその場合、javascriptは基本一番最後に記載した方がいいのでしょうか？

Answer 1

vueインスタンス(app)作成時にidが存在してないとダメということだと思ってます。前者の場合new Vue時に#appがないのでDOM操作ができないのでは。
最後に書くのは悪くないと思ってます。