Django本地环境静态文件修改不生效问题求助

本地开发时修改静态文件后，Django无法应用更改，文件本身已更新，但以下操作均无效：

• 清除浏览器缓存
• 重启服务器
• 执行相关问题的1、2步解决方案
• 更换浏览器
• 删除__pycache__文件

希望有人能解释问题原因并提供修复方案！

补充信息 #

模板引用代码 #

<script type="module" src= "{% static 'homepage/APICalls.js' %}?version=1"></script>
{% endblock content %}

请求日志 #

[06/May/2024 15:48:20] "GET /statico/homepage/APICalls.js?version=1 HTTP/1.1" 200 1987

静态文件配置 #

STATIC_URL = 'static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

项目文件结构 #

C:.
│   db.sqlite3
│   manage.py
│
├───homepage
│   │   admin.py
│   │   apps.py
│   │   credentials.py
│   │   get_jahia_json.py
│   │   models.py
│   │   permissions.py
│   │   serializers.py
│   │   setter.json
│   │   tests.py
│   │   views.py
│   │   __init__.py
│   │
│   ├───migrations
│   │   │   
│   │   │
│   │   └───__pycache__
│   │           
│   │
│   ├───static
│   │   └───homepage
│   │           add-icon.svg
│   │           APICalls.js
│   │           comparison_page.css
│   │           content_menu.css
│   │           custom.css
│   │           functions.js
│   │           modifications_page.css
│   │           module_page.css
│   │           module_table.css
│   │           navbar.css
│   │           Neo_Sans_Pro_Bold.woff2
│   │           Plateformepage.css
│   │           responsive.css
│   │           responsive_module.css
│   │           responsive_navbar.css
│   │           responsive_plateforme.css
│   │           Roboto-Regular.woff2
│   │           searchbar.css
│   │           toggle.css
│   │           toggles.js
│   │           unicorn.css
│   │
│   ├───templates
│   │   └───homepage
│   │           all_modifs.html
│   │           base_test.html
│   │           comparison_page.html
│   │           homepage.html
│   │           homepage_test.html
│   │           module_page.html
│   │           Plateformes.json
│   │           plateforme_page.html
│   │           _modal.html
│   │           _modif.html
│   │           _module.html
│   │           _Plateforme_bloc.html
│   │           _Plateforme_bloc_test.html
│   │           _toggle.html
│   │           _version.html
│   │
│   └───__pycache__
│          
│
├───module_monitoring
│   │   asgi.py
│   │   settings.py
│   │   urls.py
│   │   wsgi.py
│   │   __init__.py
│   │
│   └───__pycache__
│           settings.cpython-310.pyc
│           urls.cpython-310.pyc
│           wsgi.cpython-310.pyc
│           __init__.cpython-310.pyc
│
└───static
    ├───admin
    │   ├───css
    │   │   │  
    │   │   │
    │   │   └───vendor
    │   │       └───select2
    │   │               
    │   │
    │   ├───img
    │   │   │   
    │   │   │
    │   │   └───gis
    │   │           
    │   └───js
    │       │   
    │       │
    │       ├───admin
    │       │      
    │       │
    │       └───vendor
    │           ├───jquery
    │           │      
    │           │
    │           ├───select2
    │           │   │   
    │           │   │
    │           │   └───i18n
    │           │           
    │           │
    │           └───xregexp
    │                   
    │
    ├───homepage
    │       add-icon.svg
    │       APICalls.js
    │       comparison_page.css
    │       content_menu.css
    │       custom.css
    │       functions.js
    │       modifications_page.css
    │       module_page.css
    │       module_table.css
    │       navbar.css
    │       Neo_Sans_Pro_Bold.woff2
    │       Plateformepage.css
    │       responsive.css
    │       responsive_module.css
    │       responsive_navbar.css
    │       responsive_plateforme.css
    │       Roboto-Regular.woff2
    │       searchbar.css
    │       toggle.css
    │       toggles.js
    │       unicorn.css
    │
    └───rest_framework
        ├───css
        │
        │
        ├───docs
        │   ├───css
        │   │       
        │   │
        │   ├───img
        │   │      
        │   │
        │   └───js
        │           
        │
        ├───fonts
        │       
        │
        ├───img
        │       
        │
        └───js

问题原因分析 #

1. 路径不匹配：请求日志显示路径为/statico/homepage/APICalls.js，但STATIC_URL配置的是static/，说明静态文件路由配置错误，或者STATIC_URL被其他配置覆盖。
2. 静态文件目录优先级问题：项目同时存在app内的homepage/static/homepage和根目录的static/homepage，开发环境下Django默认优先读取STATIC_ROOT（根目录static）内的文件，若你修改的是app下的静态文件，未同步到根目录则会加载旧文件。

修复方案 #

1. 修正静态文件路由：检查项目urls.py，确保静态文件路由使用正确的STATIC_URL，开发环境下配置示例：

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # 其他业务路由
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

若路由中存在/statico/的配置，直接改为/static/。

2. 区分开发/生产环境静态文件配置：在settings.py中添加环境判断，开发环境直接读取app内的静态文件，避免STATIC_ROOT干扰：

import os
from pathlib import Path

BASE_DIR = Path(__file__).resolve().parent.parent

if DEBUG:
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR, 'homepage/static'),
    ]
else:
    STATIC_URL = 'static/'
    STATIC_ROOT = os.path.join(BASE_DIR, 'static')

3. 清理根目录静态文件：若之前执行过collectstatic命令，根目录static/homepage/下的文件为旧版本，直接删除该目录下的对应文件，开发环境无需执行collectstatic。

4. 强制更新浏览器缓存：将模板中引用的版本号从?version=1改为?version=2，强制浏览器加载新文件。

内容的提问来源于stack exchange，提问作者JoJoWasACode