用 Vue 已經很久了，但是沒有想起來總結一下，今天先總結一些，慢慢補充，要知道每天的工作還是很飽和的
所需環境
- node
- npm
- cnpm // 用於加快下載速度
步驟
1.在自己新建的文件夾中 打開命令行工具,全局安裝 npm install -g vue-cli，
2.vue init webpack + 項目名稱 // 不可用中文
3.然後會出現很多選擇，如下
1.Project name // 可寫可不寫，項目名稱，
2.Project description // 可寫可不寫，項目描述
3.Author // 可寫可不寫，項目作者
4.Runtime + Compiler: recommended for most users // 運行加編譯, 推薦使用
5.Install vue-router? (Y/n) // 只要項目中超過兩個頁面的，就輸 Y
6.Use ESLint to lint your code (Y/n) // 用來規範代碼的，有三個選項，建議選擇第一個，標準格式
7.Setup unit tests with Karma + Mocha? (Y/n) // 是否安裝單元測試。我目前是沒有用的，所以選的n
8.Setup e2e tests with Nightwatch(Y/n)? // 是否安裝e2e測試。我目前是沒有用的，所以選的n
4.回車之後會自動 安裝 模板和內容
5.下載完成後，進入項目目錄，npm install ，下載依賴包
6.成功後可以 npm run dev 啓動服務
7.此時一個簡單的項目就啓動起來了
然後可以看到這樣的一個頁面（圖片好像被我刪除了，大概是這樣子）
目錄結構大概是這樣，我們沒有使用測試，所以是沒有test目錄的
由於項目中的頁面比較多，還會分出來公共組件的目錄，多個模塊的目錄，每個模塊又有很多個頁面，所以這個只是下載下來之後的初版目錄，自己可以根據自己需要繼續增加目錄，下邊是我推薦增加的幾個目錄（都是src中的）
src 是我們會經常用的的目錄
assets 裏邊存放不需要國際化的靜態資源文件
css
font
images
common 裏邊存放公共的工具或樣式，
element-ui 的部分重寫
tool-公用方法
components 裏邊可以存放公共的組件,包括公用的底部，或者表格，搜索框，彈框等組件
layout 是menu的佈局，上方主導航的內容，一般放在這裏，便於管理，不用都放在App.vue中
router 是路由，所有的路由都統一寫在這裏
store 是vuex 的內容，包括action和mutation和state，使用較少，不得不用的時候採用
views 裏邊存放頁面的和頁面內組件的，在文件夾規範中會具體說一下
api.js 存放接口路徑，可直接通過this.$api.變量名 來直接使用該URL
App.vue 是主頁面，構建整個項目的頁面佈局，包括主導航和中英文切換功能
main.js 初始化vue實例並引入（包括router ，ElementUI ，axios 等）全局需要的插件
目錄還沒寫完，今天晚了，明天寫
引入 sass 如果需要用到sass的話
- 在package.json 中增加"sass-loader": “^7.1.0”, // 目前我用的是這個版本的
- 然後 cnpm install // 下載依賴包
- 在 webpack.base.conf.js 中增加loader
{
test: /.scss$/,
loaders: [‘style’, ‘css’, ‘sass’]
},
引入element UI
- cnpm install element-ui --save
- 在main.js中 import ElementUI from ‘element-ui’
- Vue.use(ElementUI)
今天先寫到這裏，下次寫如何配置路由，axios的引入，