開始學習Vue.js

準備工作

開發工具我使用了WebStorm，在裏面進行了插件安裝，步驟如下
1.安裝插件
打開Settings（或者Preferences）=>Plugins=>Browse repositories，然後搜索vue，則會查找到vue進行安裝
2.設置JavaScript語言的支持版本到ES6
Settings(Preferences) => Language & Frameworks => JavaScript. Set Javascript Language Version 修改爲 ECMAcript6


開始編寫
Vue其實和AngularJS很像，所有對於寫過Angular的人來講會更快理解一些

HTML標籤

<div id="app">
  {{ message }}
</div>

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

以上就是一個最簡單的例子，來自官方
[url]http://v1.vuejs.org/guide/index.html[/url]


構建項目
vue有自己的構建工具(vue-cli)
主要是結合webpack或者browserify來生成構建項目

首先先進行安裝vue-cli，（需要node環境）

npm install -g vue-cli

，全局安裝vue-cli
通過vue list可以列出vue-cli所支持的模板，也就是可以構建出不同模板形式的項目結構
比如使用webpack模板

vue init webpack getStart

會幫我們創建一個基於webpack構建的項目，生成相應的文件目錄以及代碼

cd getStart

進入項目目錄之後

npm install

進行安裝項目得依賴，安裝完成後，使用

npm run dev

來運行啓動這個生成的項目