vue+django+nginx部署

当通过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