一. 安裝nodejs，這個網上已經有很多教程就不多說了，按照默認配置安裝以后node里會自帶npm包管理工具
（1） 安裝npm淘寶鏡像（可以在某些命令下用cnpm替代npm，下載安裝的速度更快）
npm install -g cnpm --registry=https://registry.npm.taobao.org
（2） facebook開源出新的包管理工具，yarn，親測比npm好用許多，給個傳送門，大家可以去看看，另外貼一個yarn與npm命令行的比較帖
二. 全局安裝vue腳手架和webpack
npm install vue-cli webpack -g
三. 使用vue-cli腳手架工具初始化項目
vue init webpack xxx（項目名稱）
四. 填寫完項目名稱，描述，作者，模板編譯，eslint配置（標準），單元測試的需求以后進入項目文件夾
cd xxx（項目名稱）
五. 安裝npm包的依賴（vue-cli會默認配置package.json，其中dependencies對應的依賴列表會被webpack打包到生產環境，而devDependencies對應的依賴立標只是在開發環境時會被引用，不會運用到生產環境。另外，如果有需要添加額外的依賴時，--save代表添加依賴到package.json文件中dependencies的依賴列表下，而--save-dev則是添加依賴到devDependencies下）
npm install/yarn install/yarn（根據當前文件夾下的package.json來下載安裝對應的依賴）
六. 測試以上步驟是否生效，成功則能在瀏覽器看到vue的測試首頁
npm run dev/yarn run dev（開發環境下webpack調用一個自帶的express服務器展示你的代碼）
七. 添加less依賴,從而可以直接在.vue文件中寫less代碼（需要給style加上lang="less"屬性）
npm install less less-loader --save-dev/yarn add less less-loader --dev
<style lang="less" scoped>
body {
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif;
}
</style>
八. 給項目添加一個可以發起http請求的插件
（1）添加vue-resource依賴（這里使用--save安裝，是因為生產環境也還是需要使用到vue-resource）
安裝vue-resource：npm install vue-resource --save/yarn add vue-resource
（2） 這里也可以使用vux這個框架，框架也集成了ajax功能，使用方法和vue-resource一樣，目前來看個人感覺vux會比餓了么的mint-ui好用一些，這里有一點要提醒的是，如果使用了vux的話，記得一定要配合vux-loader使用，不然程序會報錯
安裝vux：npm install vux --save/yarn add vux
安裝vux-loader：npm install vux-loader --save-dev/yarn add vux --dev
九. 配置webstorm下對vue模板的支持
File - Settings - Plugins - Browse repositories - vue.js（install）- 重啟webstorm - File and Code Templates - 設置新建vue文件的模板（模板設置例子如下）
/**
* Created by xxx on ${DATE}.
*/
<template>
<section class="">
</section>
</template>
<script>
export default {
}
</script>
<style lang="less" scoped>
</style>
