vueコンポーネントとルーティングcdn導入方式の書き方..

コンポーネントコンポーネントコンポーネントの書き方はグローバル書き方とローカル書き方があり、グローバル書き方はすべてのvueインスタンスで使用でき、ローカルは1つのvueインスタンスに書かれています.
全体の書き方:

Vue.component('root',{template:'
    
'})

これで私たちは1歌のグローバルコンポーネントを定義して、root、直接ラベル呼び出しを使って、コンポーネントの中のtemplateテンプレートの内容をラベルにレンダリングしました!
ローカル書き方:

var vm=new Vue({
    el:'   ',
    components:{
       root:{template:'
    
'}
    }

})

足場を使いたくない場合がありますが、cdn導入方式でルーティングはどう書きますか?
まずJSを導入する

そしてhtmlページ

	
    Go to Foo
    Go to Bar

	
	
  

そしてjsページ

const app = new Vue({
	el:"#app",
    router:new VueRouter({
  	    routes:[
                {path:'/foo',component:{template:"
foo
"}},
                {path:'/bar',component:{template:"
bar
"}}
               ]
  })
})

vueインスタンスではrouterプロパティを し、プロパティの はnew VueRouter()であり、new VueRouter({})のパラメータはオブジェクトであり、 にはroutersプロパティがあり、routersプロパティは であり、 の オブジェクトはオブジェクトであり、オブジェクトにはpathプロパティ パス、componentとパスバインドのコンポーネントがあり、コンポーネントにはtemplateテンプレートプロパティがあります!