構架vuex的後台管理專案原始碼：
一、node安裝
可以參考這篇文章
二、vue-cli 全域性安裝
命令列執行 : npm install -g vue-cli // 加-g是安裝到全域性
安裝完成以後 可以輸入命令 ：vue 回車，可以看到針對vue的命令列；
三、初始化專案
執行命令： vue init webpack structure(你新建的專案名稱/檔名稱)
執行之後將會 自動初始化乙個資料夾 ：structure
四、啟動專案
繼續執行： cd demo (這是進入到demo資料夾的命令)
然後執行 安裝 ：npm install
安裝完成之後再執行命令： npm run dev
整個專案就已經啟動了：
五、修改專案結構
目前的專案結構：
（1）在src下新建vuex資料夾，在vuex資料夾下面新建modules資料夾，資料夾下放的相應模組js，actions.js，getters.js，index.js，mutation-types.js
（2）新建乙個api資料夾，用來寫axios的請求藉口,裡面放乙個api.js，config.js
（3）新建views，用來存放業務模組
現在的專案結構：
六、在main.js裡面引入vuex，element等
//引入vuex
import vuex from 'vuex'
import store from './vuex'vue.config.productiontip = false
//use
vue.use(vuex)/*
eslint-disable no-new
*/new
vue(,
"postcss-url": {},
//to edit target browsers: use "browserslist" field in package.json
"autoprefixer": {},
//8-2
"postcss-cssnext": {}
}}然後安裝postcss-cssnext外掛程式，npm install -g postcss-cssnext
在components中新建header.vue，menu.vue，footer.vue
可以參考原始碼：
八、執行之後
vue初始化專案
速查 vue v npm v sudo npm install global vue cli sudo npm install g vue cli init 進入包下 vue init webpack home檢查node和npm版本 node vv14.3.0 npm v6.14.5 安裝vue ...
vue初始化專案
1 初始化專案 命令 f vueworkspace vue init webpack demo project 2 建立好的專案目錄結構 其中 build 專案構建 webpack 相關 檔案說明 build.js 生產環境構建指令碼 check versions.js 檢查npm node.js版...
vuex的初始化
建立store資料夾 1.功能 放非同步操作 檔案 actions.js 內容 2.功能 獲取state裡資料 檔案 getters.js 內容 export const singer state state.singer 3.功能 放置方法名 檔案 mutation types.js 內容 exp...