一、先介紹一下我接下來要做的項目
項目：ide可視化工具
技術應用：
Vue2.0（js框架）：https://cn.vuejs.org/
ElementUi（餓了嗎ui框架基於vue的）：http://element.eleme.io/#/zh-CN
Ecahrts（圖表）：http://echarts.baidu.com/
vue-power-drag（仿grister的vue拖拽插件）：https://xiongcaihu.github.io/#/
項目介紹：ide要實現的是供企業或者個人編輯可視化圖表，適應不同分辨率的屏幕，配置的基本默認樣式達到客戶要求，項目模塊分為儀表盤、工作表、數據源、編輯圖表等。
二、項目環境搭建
vue環境配置：
首先安裝node：http://www.runoob.com/nodejs/nodejs-install-setup.html
1、安裝淘寶鏡像：npm install -g cnpm --registry=https://registry.npm.taobao.org
注：下面的npm可換成cnpm下載快
2、安裝webpack：npm install webpack -g
3、安裝vue腳手架：npm install vue-cli -g
4、cd 目錄
5、創建項目：vue init webpack 工程名
Use ESLint to lint your code：這個是代碼警告提示這個很煩人的建議最好不要
安裝后的項目目錄
6、安裝項目依賴：npm install
7、安裝 vue 路由模塊vue-router和網絡請求模塊vue-resource：cnpm install vue-router vue-resource --save
8、安裝elementui：npm install element-ui --save
9、安裝vue的gridster：npm install vue-power-drag
10、安裝echarts：npm install echarts -S
11、安裝axios驚醒HTTP請求：npm install axios
12、啟動項目：npm run dev
main.js配置：
注：echarts和axios不能像element一樣用use全局使用，只能放在Vue原型上。
這個目錄下static文件可以放外鏈js，assets文件放置圖片還有css文件
外部css文件引入可以這樣寫：
<style>
@import url("assets/css/common.css");
</style>
外部js引入可以這樣寫：
import {getOption,getOption2} from '../../../static/js/js.js'
js文件加導出：
總結：項目的技術選型還有環境搭建基本完成可以步入開發了
項目剛開始啟動我后面也會針對項目開發所遇到的問題進行總結
推薦一份簡書（vue從環境搭建到發布）：http://www.jianshu.com/p/5ba253651c3b