vue 項目的開發流程

1.$ node -v (檢測node版本，node版本須要在 V4 以上)

2.全局安裝vue $ npm install -g vue

3.安裝腳手架 $ npm install -g vue-cli

4.運行 vue 命令，看是否已安裝完畢 $ vue / $ vue list (查看可安裝的模板)

5.安裝模板 $ vue init webpack(模板) sell(項目名稱)

6.? Project name sell

　? Project description sell app

　? Author crazyCode <1178770858@qq.com>

　? Use ESLint to lint your code? Yes

　? Pick an ESLint preset Standard

　? Setup unit tests with Karma + Mocha? No

　? Setup e2e tests with Nightwatch? No

7.$ cd sell (進入項目目錄)

8.$ ll -a (查看目錄結構)

9.$ npm install (安裝模塊下代碼的依賴)

10.$ npm run dev (運行項目)

11.項目準備 A.新建resource文件夾，將圖片文件放在 resource 之中

　　　　　　B.經過IcoMoon 將svg 圖片製做成矢量圖標

12. 設計項目目錄A.因此的代碼文件都放在 src 文件夾中 ，src 下 通常有三個子目錄 assets 、components(在其中自建文件夾，存放組件，知足組件就近維護的原則) 和common(公共的模塊和資源，其中有3個子目錄,js,stylus,fonts)

B.圖片資源文件放在 resource 文件夾之中

13.複製以前的矢量圖標文件(4個)及 style.css，存放在fonts文件目錄和 stylus文件目錄下，將style.css 更名爲 icon.styl 且內容格式同步（只需刪除文件中{}和 ； 便可）

14.刪除assets 和 router 目錄

15.編制數據接口  build --> dev-server.js

在 dev-server 中設置 獲取 調用 數據

16.安裝 Google 的 jsonview 插件，格式化 json 數據

17.在static項目下，新建css文件夾，存放 reset.css ,官網：http://cssreset.com

18.配置分號（;） semi (默認eslint 是沒有分號的，若是強加；號，會報錯，須要到eslintrc.js 下配置)

19.設置代碼縮進

20.在App.vue 上進行區塊佈局

注意路徑 ./ 表示當前路徑

import  ***  from  '***' --> 引用

export default {

　　components: {

　　　　'v-header': header

　　}

} --> 註冊

export 與 export default 的區別是 export default 是相對於 整個modal 導出

21.安裝 stylus-loader以前，需先安裝 stylus

$ npm install stylus

$ npm install stylus-loader

22.下載vue-router   $ npm install vue-router   (文檔 http://router.vuejs.org/zh-cn/)

23.綁定a標籤  v-link="{path:'***'}"  組件(路由外鏈) <router-view></router-view>