一、vue環境搭建
1、下載安裝node.js。
2、安裝淘寶鏡像cnpm，在命令窗口輸入：
npm install -g cnpm --registry=https://registry.npm.taobao.org
3、安裝Vue，在命令窗口輸入：
cnpm install vue
4、安裝vue-cli腳手架構建工具，在命令窗口輸入：
cnpm install -g vue-cli
至此vue環境配置完成。
二、構建vue項目
1、利用vue新建vue項目，打開Django項目，在PyCharm工具下Terminal中輸入：
vue-init webpack “項目名稱（frontend）”
2、安裝vue項目的依賴包，進入到項目的frontend下進行安裝（耗時較長），具體操作如下：
1、cd frontend 2、cnpm install
三、host與port配置
1、打開frontend->config->index.js，配置host與port，如下圖所示：
2、本地配置hosts文件，如下圖所示：
四、跨域配置
1、配置django-cors-headers，在項目終端輸入：
pip install django-webpack-load
2、在項目中的conf/default.py中配置，如下如所示：
五、項目文件配置
1、在frontend/src/component文件夾下新建一個名為Library.vue的組件:
2、文件路徑配置
六、項目運行，一定要進入到frontend路徑下才能運行：
npm run dev
運行效果如下圖：
至此，web項目搭建完成。
七、功能完成后需要編譯，進行webpack打包，命令如下：
nom run build