django與vue的完美結(jié)合_實(shí)現(xiàn)前后端的分離開發(fā)之后在整合的方法
最近接到一個(gè)任務(wù)，就是用django后端，前段用vue，做一個(gè)普通的簡單系統(tǒng)，我就是一搞后端的，聽到vue也是比較震驚，之前壓根沒接觸過vue.
看了vue的一些文檔，還有一些項(xiàng)目，先說一下django與vue的完美結(jié)合吧！
首先是創(chuàng)建一個(gè)django項(xiàng)目
django-admin startproject mysite # 創(chuàng)建mysite項(xiàng)目 django-admin startapp blog # 創(chuàng)建blog應(yīng)用
一、接下來就是安裝關(guān)于vue 的東西了
1、首先安裝node.js，官網(wǎng)地址：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項(xiàng)目中創(chuàng)建vue項(xiàng)目
首先，進(jìn)去django項(xiàng)目的項(xiàng)目目錄中，執(zhí)行：
vue-init webpack firstvue## firstvue為前端項(xiàng)目的名稱，可自定義。創(chuàng)建的項(xiàng)目會(huì)跟django中的app一樣的目錄登記。類似一個(gè)前端app一樣。
mysite 文件夾 blog 文件夾 和 firstvue文件夾 要在同一目錄級(jí)別
在創(chuàng)建時(shí)，會(huì)彈出很多選擇項(xiàng)，根據(jù)自己需求自定義修改。也可以全部回車，使用默認(rèn)的。這里我就直接全部回車。
三、編寫vue前端項(xiàng)目，直接編寫就是，調(diào)試則可以執(zhí)行。也可先不編寫，跳過這一步
cd firstvue## 進(jìn)入到上一部創(chuàng)建的firstvue項(xiàng)目中 cnpm install ## 安裝需要的依賴模塊 cnpm run dev ## 運(yùn)行調(diào)式的服務(wù)，會(huì)啟動(dòng)一個(gè)web服務(wù)，訪問localhost:8080 即可調(diào)式
四、vue項(xiàng)目寫完后，打包vue項(xiàng)目，然后修改django配置，將vue集成到django中
cnpm run build ## 打包vue項(xiàng)目，會(huì)將所有東西打包成一個(gè)dist文件夾
五、接下來就是配置django中的setting文件了：
六、修改django的主目錄的urls文件：
七、啟動(dòng)django服務(wù)，訪問localhost:8000 則可以出現(xiàn)vue的首頁。
python manage.py runserver
以上這篇django與vue的完美結(jié)合_實(shí)現(xiàn)前后端的分離開發(fā)之后在整合的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
- vue-resource post數(shù)據(jù)時(shí)碰到Django csrf問題的解決
- 使用django和vue進(jìn)行數(shù)據(jù)交互的方法步驟
- django和vue實(shí)現(xiàn)數(shù)據(jù)交互的方法
- django rest framework vue 實(shí)現(xiàn)用戶登錄詳解
- Python Django Vue 項(xiàng)目創(chuàng)建過程詳解
- Vue+Django項(xiàng)目部署詳解
- Django與Vue語法的沖突問題完美解決方法
- Django+Vue.js搭建前后端分離項(xiàng)目的示例
- Django vue前后端分離整合過程解析
相關(guān)文章
CairoSVG是一個(gè)強(qiáng)大的Python庫,用于將SVG圖像轉(zhuǎn)換為PNG、PDF、PS等格式,本文就來介紹一下Python中CairoSVG庫的使用教程,感興趣的可以了解一下2025-01-01
python 使用poster模塊進(jìn)行http方式的文件傳輸?shù)椒?wù)器的方法
今天小編就為大家分享一篇python 使用poster模塊進(jìn)行http方式的文件傳輸?shù)椒?wù)器的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-01-01
淺談keras的深度模型訓(xùn)練過程及結(jié)果記錄方式
今天小編就為大家分享一篇淺談keras的深度模型訓(xùn)練過程及結(jié)果記錄方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-01-01
這篇文章主要介紹了Python定時(shí)器線程池原理詳解,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-02-02
Flask框架利用Echarts實(shí)現(xiàn)繪制圖形
echarts是百度推出的一款開源的基于JavaScript的可視化圖表庫，該開發(fā)庫目前發(fā)展非常不錯(cuò)，且支持各類圖形的繪制可定制程度高。如下演示案例中，將分別展示運(yùn)用該繪圖庫如何前后端交互繪制（餅狀圖，柱狀圖，折線圖）這三種最基本的圖形，需要的可以參考一下2022-10-10
淺拷貝，指的是重新分配一塊內(nèi)存，創(chuàng)建一個(gè)新的對(duì)象，但里面的元素是原對(duì)象中各個(gè)子對(duì)象的引用。深拷貝，是指重新分配一塊內(nèi)存，創(chuàng)建一個(gè)新的對(duì)象，并且將原對(duì)象中的元素，以遞歸的方式，通過創(chuàng)建新的子對(duì)象拷貝到新對(duì)象中。因此，新對(duì)象和原對(duì)象沒有任何關(guān)聯(lián)2022-11-11
這篇文章主要介紹了Python 如何展開嵌套的序列，文中講解非常細(xì)致，代碼幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下2020-08-08
這篇文章主要介紹了Python 線程池的相關(guān)資料，幫助大家更好的理解和學(xué)習(xí)python，感興趣的朋友可以了解下2020-08-08
在使用pip命令安裝python的一些庫時(shí),由于默認(rèn)服務(wù)器在國外,因此下載需要很長時(shí)間,本文主要介紹了ubuntu22.04將python源切換為清華源的方法,感興趣的可以了解一下2023-12-12
這篇文章主要介紹了python子線程退出及線程退出控制的代碼，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-10-10