vue+django 项目 打包

vue 打包到django项目中   

 

当通过vue-cli完成了一个vue项目时，通过 npm run build 指令将项目打包，这时候就会将文件集中到dist文件夹中,
我们需要将这个文件夹放在django的目录下。

首先配置urls.py文件，加入
from django.views.generic import TemplateView
urlpatterns = [
……
path('',TemplateView.as_view(template_name="index.html"),name="index"),
  ……
]
修改settings.py，我们需要配置模板文件位置和静态文件位置
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': ['dist'],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "dist/static"), ]

这时候运行django，访问127.0.0.1:8000就可以看到你的vue项目的前端了。

之后配置nginx和uwsgi文件，步骤和部署django+nginx没有太大的差别，只要修改nginx配置文件中的静态文件夹就行了，将它指向dist中static

————————————————
版权声明：本文为CSDN博主「Qc1998」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/Qc1998/article/details/79943561