Django+vue在騰訊雲上搭建先後端分離項目

最近打算用Django+vue搭建一個我的主站，在此記錄一下搭建項目的整個過程。

一 開發環境：

　　騰訊雲Centos     7

　　Python                3.7

　　Django                2.1.7

　　vue.js                  2.9.6

　　mysql                  5.7

二 建立Django項目：

　　由於個人主站是要放在騰訊雲上來跑的，因此整個項目環境都應該是配在linux上的。

　　1.在指定路徑來建立Django項目：

　　　　命令：django-admin startproject website

　　2.而後cd 到項目根目錄下來建立一個app：

　　　　命令：python manage.py startapp mywebsite

　　這樣Django項目就建立成功了，固然，還有好多配置沒有配，不急，等咱們把vue前端項目也建立完成後一塊兒配 

三 建立vue前端項目

　　下面來建立一個前端項目：

　　1.在使用vue時須要先安裝node.js：

　　　　　　命令：wget https://nodejs.org/dist/v8.5.0/node-v8.5.0-linux-x64.tar.gz

　　　　解壓：

　　　　　　命令：tar zxvf node-v8.5.0-linux-x64.tar.gz

　　　　配置node環境變量（將這兩行加到 /etc/profile中）：

　　　　　　命令：vim /etc/profile

　　　　　　　　PATH=$PATH:/usr/local/node-v9.3.0
　　　　　　　　export PATH

　　　　重載使該文件生效：

　　　　　　命令：source /etc/profile

　　2. 建立vue項目：

　　　　cd到Django項目根目錄下：

　　　　　　命令：vue-init webpack myvue 

　　　　myvue 是前端項目的項目名，必需要和Django的app同級才行：

　　　　

　　　　建立項目時會有許多選項，一路回車+ 「Y」便可。

　　3.安裝依賴包：

　　　　cd到vue前端項目myvue中：

　　　　　　安裝依賴包：npm install

　　4.打包vue項目（將全部東西打包成一個dist文件夾，之後的static和templates都在這裏邊）：

　　　　在myvue中執行命令： cnpm run build

　　這樣前端vue項目建立完成：

　　　　

四 整合Django和Vue

　　先後端項目都建立完成後咱們來進行整合：

　　在Django項目根目錄下，有一個和項目同名的文件夾website，這個文件夾中有一個settings.py，是用來配置整個Django項目的。

　　1. 咱們當初建立了一個mywebsite的app，如今咱們要把他加到Django項目的app中來：

　　在settings.py中找到 INSTALLED_APPS 加上app名稱。

　　　　

　　2. 更改數據庫，Django項目默認使用自帶的sqllit3數據庫，這裏咱們要換成mysql，一樣也是在settings.py中操做：

　　　　

　　　　由於咱們用的是python3，python3提供操做mysql的庫是pymysql，可是Django默認的是mtsqldb,因此若是隻在settings中更改數據庫，到時候項目會報錯.

　　　　還要改這裏：在和Django項目同名的文件夾下有一個__init__.py，在這個文件中加上這麼兩句：

　　　　　　import pymysql  

　　　　　　pymysql.install_as_MySQLdb()

 　　　　就OK了：

　　3.更改模板templates位置：　在紅框位置天前端項目的dist文件夾路徑　　　　　　　   

              　　　　　　

 　　4. 更改static靜態文件路徑： 在settings中添加這個：指向靜態文件static文件夾

　　　　

　　5. 配置urls：

　　　在Django項目同名文件夾下有一個urls.py  這裏邊是整個Django項目的路由設置。

　　　還記得在前端vue項目的dist文件夾下有一個index.html 嗎？這個html就是vue項目的主界面，

　　　　如今咱們在urls中添加這麼一句： path('', TemplateView.as_view(template_name="index.html")),

　　　　

 　　這表示當咱們啓動項目後在ip+端口後什麼都不寫時，就會跳轉到這個vue主界面中來：

　　　　　

　　　　按理來講，全部的路由轉發均可以在這個urls.py中完成，可是若是你的項目有許多app，路由也會變得不少，到時候有可能會搞混，因此正確的作法是在每一個app下都建立一個urls.py，每一個app的路由都寫在本身的app下，

　　　　這樣一來，Django項目同名的文件夾下的urls.py就是一級路由，app下的纔是二級路由，一級路由只須要向二級路由作轉發就行了。

　　　　

　　　　

 　　　　

到這裏，利用Django+Vue搭建我的站點的項目建立過程就結束了。

想了解更多Python關於爬蟲、數據分析的內容，歡迎你們關注個人微信公衆號：悟道Python