django项目结合Vue的生产发布梳理

2024年05月21日 编程 暂无评论 阅读71 次

介绍

django的生产发布与开发环境还是很不一样,本文梳理一下生产发布具体有哪些配置。

statci静态资源收集

django中有很多app,自己建的或者第三方的。这些app都有自己的static目录。
开发的时候,当文件路径是/static的文件,django会去各个app的static目录下寻找有没有对应文件
但是生产的时候,需要执行collect命令,将各个app下的static目录下的文件复制到指定的STATIC_ROOT目录下,然后添加路由就是static路径就到STATIC_ROOT目录下寻找了

python manage.py collectstatic

下面的STATIC_ROOT路径有两种配置,
一种是移动到项目之外的文件夹,这等于说是让nginx来路由静态文件
一种是我这里写的移动到项目的www/static目录下

setting文件配置:
# 下面还是想让django服务来处理静态文件,所以放在项目根目录下,同时生产环境要增加对static的路由配置。  
#STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'www', 'static')
STATIC_ROOT = os.path.join(BASE_DIR, 'www', 'static')  
  
STATIC_URL = '/static/'  
STATICFILES_DIRS = (  
    os.path.join(BASE_DIR, "static"),  
)

url配置:
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

需要注意的是,这只针对的各个app的static目录下的文件的合并。其他静态文件比如media,template是没有合并的,还是需要自己额外处理路由关系。

给一个工程目录的截图,就是将xadmin的static目录下的文件移动到了www/static目录下了,
其他templates等文件还是没移动的

结合vue

三种结合vue的方法
第一种vue有自己的域名服务器,使用跨域与后端通信
另外两种和STATIC_ROOT的两种配置对应。

vue打包之后是index.html和js和css静态文件。要修改一下静态资源输出目录改为static

pnpm run build

import { defineConfig } from 'vite'  
import vue from '@vitejs/plugin-vue'  
import path from 'path'  
  
export default defineConfig({  
  plugins: [vue()],  
  resolve: {  
    alias: {  
      // Set '@' to point to the 'src' directory  
      '@': path.resolve(__dirname, './src'),  
    }  
  },  
  server: {  
    host: '0.0.0.0',  
    port: 8089  
  },  
  build: {  
    // 设置静态资源目录名为 'static'    assetsDir: 'static',  
    // 设置输出目录  
    outDir: 'dist'  
  }  
})

之后将index.html文件放到django的template目录下。
static文件夹以及其中的js和css文件夹放到django的static文件夹,如果是项目外文件使用nginx路由,项目类使用url路由

另外url路由要配置好

#增加下面路由,没有配置好的路由统一路由到index.html文件
urlpatterns += [  
    path('', TemplateView.as_view(template_name='index.html')),  
]

# drf的框架的页面路由可以增加一层api
path('api/', include(router.urls)), # Viewset定义的路由可以随意修改前缀了很方便

# django本身的模板路由路径参考,不要和vue的路由冲突
path('django_index/', getindex, name='django_index'),
def getindex(request):  
    return render(request,'django_index.html')

# 其他django的路由也注意不要和vue的路由路径冲突即可。

 

uwsgi

开发环境使用的python manage runserver来启动服务,这种服务器对多线程等支持不好
需要使用uwsgi来启动django项目
安装

pip install uwsgi

# 进入虚拟环境,启动项目
source /mnt/env/loginRegisterDemoEnv/bin/activate 
uwsgi --http :8080 --chdir /mnt/loginRegisterDemoServer --module mydrftest.wsgi

# 结束django服务,直接使用kill 端口号是不行的,有守护进程
# 使用下面命令即可
pkill -9 uwsgi

可以看到项目目录下有个wsgi.py文件

然后看情况配置nginx
将setting文件的 DEBUG = False 关闭错误日志即可

标签:

给我留言

登录

忘记密码 ?

切换登录

注册