vue-cli構建vue程序后項目是怎么運行的(index.html,main.js,app.vue之間的關系)

如圖,這個是使用vue-cli構建項目后刪除一些沒用的東西,簡潔的目錄結構

1.index.html

這個是index.html文件,可以看到,body里面有一個id="app"的div

2.main.js

這里new Vue()是創建了一個新的vue實例,
new Vue().$mount("#app") 這里是在vue實例上掛載元素, 這個元素就是index.html中id="app"的div元素
上面引入了App組件 所以在實例里render了App

3.App.vue

標簽將會把路由相關內容渲染在這個地方