Vue のプロジェクトを html js 1 ファイルずつのみで最小限で作る

why

何も理解せずにホイホイ入れるのもダメだと思って

how

    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <div id="app">
      {{ msg }}
    </div>

index.html を作る

cdn の vue の dist をロードする

div id app を作成、中で js の vue 部分から定義される msg の data 変数を展開する

var app = new Vue ({
  el: "#app",
  data: {
    msg: 'message'
  },    

index.js を作る

new Vue で vue のインスタンスを作成して、

el に id を指定することで、そのタグ部分をマウントして

data に データを定義する。

こうすることで、マウントされた html 部分で Vue の data を表示できるようになる。