django + vue整合后，部署到windows apache遇到的问题汇总

Posted 2023-05-04

参考技术A 花了一周多时间，从0到1，创建了 django + elementUI接口自动化平台。
vue 数据绑定模式，能减少很多前端工作，（前端目前难看的很呐）

web接口自动化，基于 python + request + excel模式的升级维护，结合企业微信、邮件、echarts报告展示，定时器BackgroundScheduler（而不是用windows任务计划+bat 单机模式），定时任务输出结果。归于web，多人维护后，相信对将来工作有帮助。。。起码也是写过django接口框架的人了。。

部署花了3天时间，才搞定。哀愁
遇到问题：

2、然后把两个整个在一起
3、整合后，django 启动后，vue刷新当前页面404，这个vue router/index.js，去掉mode: 'history'

vue，config/index.js，build方法，
说要改为ssetsPublicPath: './' -----》结果不需要，原样

vue项目下，build/webpack.prod.conf.js，注释模块解决。

5、在本地跑没有问题，部署到apache，vue，staitc静态资源无法访问
参考如下，给静态资源访问权限，并且路径是双引号，解决
https://www.cnblogs.com/CodeMuscle/p/12923045.html

如何将我的 Vue js SPA 部署到我的 Django 服务器中？

【中文标题】如何将我的 Vue js SPA 部署到我的 Django 服务器中？

【英文标题】：How do I deploy my Vue js SPA into my Django server?

【发布时间】：2019-07-06 04:55:50

【问题描述】：

我目前正在按照本指南将我的 Vue.js 前端与我的 Django 后端集成：https://medium.com/@williamgnlee/simple-integrated-django-vue-js-web-application-configured-for-heroku-deployment-c4bd2b37aa70

现在，我只想能够将默认的 Vue.js 样板 index.html 页面渲染到我的 Django 服务器 http://localhost:8000/

我使用 django-admin startproject django-vue-template 来初始化 Django，并在新创建的 django-vue-template 文件夹中运行 vue create . 来初始化 Vue CLI。然后我运行npm run build，所以我的项目文件夹树现在看起来像this。

我还将这些更改添加到我的 settings.py 中：

TEMPLATES = [
    
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, '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'),
]

以及对我的 urls.py 的这些更改：

urlpatterns = [
  path('admin/', admin.site.urls),
  url(r'^$', TemplateView.as_view(template_name='index.html')),
]

根据指南，当我运行 python manage.py runserver 时，我应该已经在 http://localhost:8000/ 上看到了 Vue.js index.html 页面，但是除了白屏之外什么都没有呈现，当我检查控制台时，我被轰炸了错误 404s 如图here.

Django 似乎能够找到我的 index.html，但它无法找到并导入使其 SPA 功能正常工作所需的 css 和 js 文件。

【问题讨论】：

你能添加你的 index.html 吗？

【参考方案1】：

您必须手动配置 确保在 index.html 的顶部必须有：

% load static %

然后所有链接看起来像：

<script src="% static "app.d34dcca9.js" %"></script>

与 css 文件或图像相同。

【参考方案2】：

你也可以通过以下设置vue.config.js来解决这个问题：

module.exports = 
  assetsDir: 'static',