溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
  • 首頁 > 
  • 教程 > 
  • 開發技術 > 
  • django與vue的完美結合_實現前后端的分離開發之后在整合的方法

django與vue的完美結合_實現前后端的分離開發之后在整合的方法

發布時間:2020-10-09 20:03:19 來源:腳本之家 閱讀:200 作者:官爺 欄目:開發技術

最近接到一個任務,就是用django后端,前段用vue,做一個普通的簡單系統,我就是一搞后端的,聽到vue也是比較震驚,之前壓根沒接觸過vue.

看了vue的一些文檔,還有一些項目,先說一下django與vue的完美結合吧!

首先是創建一個django項目

 django-admin startproject mysite  # 創建mysite項目
 django-admin startapp blog  # 創建blog應用

一、接下來就是安裝關于vue 的東西了

1、首先安裝node.js,官網地址:https://nodejs.org/zh-cn/download/

2、使用npm淘寶鏡像,避免npm下載速度過慢的問題 npm install -g cnpm --registry=https://registry.npm.taobao.org

3、使用cnpm 下載vue-cli cnmp install -g cue-cli

二、在django項目中創建vue項目

首先,進去django項目的項目目錄中,執行:

vue-init webpack firstvue## firstvue為前端項目的名稱,可自定義。創建的項目會跟django中的app一樣的目錄登記。類似一個前端app一樣。

mysite 文件夾 blog 文件夾 和 firstvue文件夾 要在同一目錄級別

在創建時,會彈出很多選擇項,根據自己需求自定義修改。也可以全部回車,使用默認的。這里我就直接全部回車。

三、編寫vue前端項目,直接編寫就是,調試則可以執行。也可先不編寫,跳過這一步

cd firstvue## 進入到上一部創建的firstvue項目中 
cnpm install    ## 安裝需要的依賴模塊 
cnpm run dev    ## 運行調式的服務,會啟動一個web服務,訪問localhost:8080 即可調式 

四、vue項目寫完后,打包vue項目,然后修改django配置,將vue集成到django中

cnpm run build ## 打包vue項目,會將所有東西打包成一個dist文件夾

五、接下來就是配置django中的setting文件了:

django與vue的完美結合_實現前后端的分離開發之后在整合的方法

六、修改django的主目錄的urls文件:

django與vue的完美結合_實現前后端的分離開發之后在整合的方法

七、啟動django服務,訪問localhost:8000 則可以出現vue的首頁。

python manage.py runserver

django與vue的完美結合_實現前后端的分離開發之后在整合的方法

以上這篇django與vue的完美結合_實現前后端的分離開發之后在整合的方法就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女