寫在前面
幾個月前還沉浸在AngularJS的強大之中，最近才猛然發(fā)現(xiàn)vue已經(jīng)火熱到不行。趕緊學習一下。
目前版本為2.x，相對于1.x有一定的改變。1.x使用較為廣泛一些，能查的資料多一些，還是從1.x開始啃吧。另外值得一說的是，vue-router作為與單頁應用息息相關(guān)的一個模塊，2.x也是相對于1.x有著所謂的“破壞性”升級，即不能向下兼容。當時沒注意，還是踩了一個深深的坑，所以在此建議無論是vue還是vue-router都從從1.x開始搞起，摸清1.x的套路再往2.x升級也不遲，至少不至于拿著2.x問題去找1.x的答案。
vue-cli 安裝
vue似乎生來伴隨著webpack，官方也提供 vue-cli用于構(gòu)建vue項目骨架， 安裝方法如下：
npm install vue-cli -g
使用vue -V可以查看當前版本：
vue -V
2.3.1
可以看到當前版本為2.3.1，則默認構(gòu)建2.x版本的vue項目骨架。
初始化項目骨架
使用一下命令極客初始化：
vue init webpack vue-test
但是前面說過，默認會構(gòu)建2.x版本，于是構(gòu)建1.x版本的命令如下：
vue init webpack#1.0 vue-test
之后的項目初始化README.md已經(jīng)寫得很清楚了，可以參照步驟去做。
一些必要的構(gòu)建配置
項目根目錄下build文件包含項目構(gòu)建相關(guān)的配置與腳本，一般情況下不需要改動太多東西，安裝默認配置即可。有一些必要的東西，比如JQuery的全局配置,可以再webpack.base.conf.js的plugins屬性下加入：
new webpack.ProvidePlugin({
$: 'jquery',
'jQuery': 'jquery' })
}
如果需要根據(jù)不用環(huán)境的參數(shù)（如測試環(huán)境與生產(chǎn)環(huán)境的API地址）可以再對環(huán)境的webpack config文件的plugins加入：
new webpack.DefinePlugin({
'process.env': config.dev.env,
ENV: config.dev.env //這里可以配置任何根據(jù)環(huán)境變化的參數(shù)
}
)
結(jié)語
很簡單的一個開始，vue雖然學的時間不長，但也是從AngularJS這種重量級項目下轉(zhuǎn)過來的，vue的很多地方都可以無師自通，當然遇到的坑也在所難免，會在以后一一道來，另外學習vue的過程中還結(jié)合了另外一套ui框架semantic-ui，即語義化ui，相較于bootstrap，有一些吸引人的地方當然也是bootstrap用的有點煩了_，想嘗嘗鮮。
