前言：這一章主要是vue的介紹、安裝、以及如何建立一個vue例項。
一、vue介紹
vue3中文官網：建議先自己看官網。
vue是漸進式框架，漸進式指的就是可以在你的專案已經有js，jquery等框架後還可以嵌入vue框架。可以只用我的一部分，而不是一個專案必須全部由我開發。
安裝
將 Vue.js 新增到專案中主要有四種方式：
1.以 CDN 包的形式匯入。
<script src="https://unpkg.com/vue@next"></script>
那麼cdn是什麼？
CDN 是vue檔案線上上的地址。例如https:.../vue..
我們在訪問專案時，首先通過域名找到伺服器的ip（一臺電腦/伺服器），看看你的專案是什麼web框架（例如django)，然後找到分配的路由，然後就找到了vue.js檔案。所以說是要有一個過程的，那麼cdn的作用就是加速這個過程。
CDN能夠加速使用者的訪問速度。
我們的伺服器分為華南、華北等幾個區域，如果使用者是華北區的，那麼要訪問華北區的伺服器比較快，當使用者第一次訪問華北區的伺服器，那麼伺服器會把資料快取在華北（邊緣）伺服器上，訪問專案慢實際是訪問專案資源（圖片、視訊等）的快慢。那麼下一個人訪問的時候直接讀取這個華北伺服器的快取，所以訪問速度會加快。
2.下載 js 檔案並自行託管。
官網沒有給出js下載地址。我們可以把上邊的cdn線上地址放到瀏覽器執行，ctrl+s儲存就是vue.js.
或者在我上傳的資源裡去找。
實際上還是本地載入比線上要快很多。下載下來放到js裡引入即可。
3.使用 npm 安裝它。
這個我們暫時不用。應用大型專案可以用npm。
有空再寫。可在我的vue專欄看到這篇。
4.使用官方的 CLI 來構建一個專案。
它為現代前端工作流程提供了功能齊備的構建設定 (例如，熱過載、儲存時的提示等等)。
有空再寫。可在我的vue專欄看到這篇。
使用vue開發的好處
1.因為vue採用漸進式框架結構，MVVM（model view viewmodel)，資料層與檢視層分離，（響應式框架）通過vm把資料層的資料渲染到指定的標籤裡面。
2.響應式框架，資料層與檢視層分離，資料層資料變了，檢視層的渲染就變了，減少了dom操作，增加了頁面載入速度。
3.元件化開發。
簡潔來說就是：體積小，資料雙向繫結，有很多成熟的元件。
二、基礎
1.建立vue例項
步驟：
1）下載並引入vue.js
2）body裡建立id=app 的div
3）Script 裡面建立vue例項，關聯容器，Vue.createApp({}).mount('#app')
資料層：
const data = { a: 1 }
檢視層：
const app={
data() {
return data
}，
}
建立vue例項：
const vm =Vue.createApp(app)
關聯app容器
vm.mount('#app')
或者合起來寫：
const data = { a: 1 }
const vm = Vue.createApp({
data() {
return data
}}).mount('#app')
執行模板：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/vue.global.js"></script>
</head>
<body >
<div id="app">
Hello Vue
</div>
</body>
<script type="text/javascript">
const data = {
}
const vm = Vue.createApp({
data() {
return data
},
})
vm.mount('#app')
</script>
</html>