Vue是一款前端框架，它的環(huán)境配置有兩種，一種是線上環(huán)境下引入Vue庫(kù)，一種是離線配置Vue環(huán)境。
若是在線環(huán)境下使用Vue，可以在HTML中引入VueCDN鏈接，簡(jiǎn)單輕便。但是若是要做離線開發(fā)的話，我們則需要下載Vue庫(kù)到本地，以便在本地進(jìn)行開發(fā)。
首先需要去Vue官網(wǎng)下載最新版的Vue.js，下載完成后，將下載下來的“vue.js”放置到我們的項(xiàng)目目錄中。
project ├── ... ├── js │ ├── vue.js │ └── ... ├── ...
然后創(chuàng)建一個(gè)HTML文件，在其頭部引入vue.js：
<!DOCTYPE html> <html> <head> <title>Vue demo</title> <script src="./js/vue.js"></script> </head> <body> ...
引入Vue后，需要在項(xiàng)目中創(chuàng)建一個(gè)Vue實(shí)例。Vue實(shí)例是 Vue 最重要的基礎(chǔ)概念之一，它是一個(gè)構(gòu)造函數(shù)，接受一個(gè)選項(xiàng)對(duì)象作為參數(shù)。
下面是基本的Vue實(shí)例創(chuàng)建模板：
var vm = new Vue({
// Vue實(shí)例的選項(xiàng)
})其中，vm是我們創(chuàng)建Vue實(shí)例時(shí)獲取的變量名，開發(fā)中可以根據(jù)自己的需求來命名，常見的有app、vue等。
選項(xiàng)對(duì)象是一個(gè)包含不同配置選項(xiàng)的JavaScript對(duì)象，下面是一個(gè)常見的選項(xiàng)對(duì)象：
var vm = new Vue({
// 選項(xiàng)
el: '#app',
data: {
message: 'Hello Vue!'
}
})以上Vue實(shí)例選項(xiàng)中，el用于指定掛載到某個(gè)元素，data用于定義初始數(shù)據(jù)，message就是初始數(shù)據(jù)。掛載元素需要在HTML中指定：
<div id="app">
{{ message }}
</div>最后，在代碼編輯器中使用npm start啟動(dòng)本地服務(wù)器，運(yùn)行前面創(chuàng)建的HTML文件，在瀏覽器中打開頁(yè)面，就可以在瀏覽器的控制臺(tái)中看到“Hello Vue!”