說明與比較：new Vue() 和 export default {}

在生成、導出、導入、使用 Vue 組件的時候，像我這種新手就會經常被位於不一樣文件的 new Vue() 和 export default{} 搞得暈頭轉向。它們含義究竟是什麼，又有什麼異同呢？

首先，Vue 是什麼？ po 主的理解是 Vue 就是一個構造函數，生成的實例是一個巨大的對象，能夠包含數據、模板、掛載元素、方法、生命週期鉤子等選項。

因此渲染的時候，能夠使用構造 Vue 實例的方式來渲染相應的 html 頁面：

new Vue({
    el: '#app'
    ...
})

那麼 export default {} 又是來幹嗎的？

這是在複用組件的時候用到的。假設咱們寫了一個單頁面組件 A 文件，而在另外一個文件 B 裏面須要用到它，那麼就要用 ES6 的 import/export 語法 ，在文件 A 中定義輸出接口 export **，在文件 B 中引入 import **，而後再生成一個 Vue 實例 new Vue (**)，把引入的組件用起來，這樣就能夠複用組件 A 去配合文件 B 生成 html 頁面了。

因此在複用組件的時候，export 和 new Vue 缺一不可。