python 3.7 +Django 3.0 配置静态文件路径并测试

新手笔记

查了自强学堂和Django官网，总结了配置静态文件的步骤，并用例子进行了测试。

不一定是最简单的方法，但是亲测可用。

1.settings文件设置（解释在注释里，主要来源为自强学堂的静态文件配置章节）

自强学堂：https://code.ziqiangxuetang.com/django/django-static-files.html

STATIC_URL = '/static/'
# 当运行 python manage.py collectstatic 的时候
# STATIC_ROOT 文件夹 是用来将所有STATICFILES_DIRS中所有文件夹中的文件，以及各app中static中的文件都复制过来
# 把这些文件放到一起是为了用apache等部署的时候更方便
# STATIC_ROOT = os.path.join(BASE_DIR, 'collected_static')
# STATIC_ROOT = os.path.join(BASE_DIR, 'static').replace('\\', '/')
STATIC_ROOT = os.path.join(BASE_DIR, 'collect_static')
# 文件名为os.path.join(BASE_DIR, "static")中的static
# os.path.join(BASE_DIR, "common_static")
# 把 jquery.js 放在 common_static/js/ 下，这样就可以 在 /static/js/jquery.js 中访问到它！
# 也可以在 settings.py 中指定所有 app 共用的静态文件，比如 jquery.js 等.common_static文件夹
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, "common_static"),
    # ('css', os.path.join(STATIC_ROOT, 'css').replace('\\', '/')),
    # ('images', os.path.join(STATIC_ROOT, 'images').replace('\\', '/')),
    # ('font', os.path.join(STATIC_ROOT, 'font').replace('\\', '/')),
)

# 这个是默认设置，Django 默认会在 STATICFILES_DIRS中的文件夹 和 各app下的static文件夹中找文件
# 注意有先后顺序，找到了就不再继续找了
STATICFILES_FINDERS = (
    "django.contrib.staticfiles.finders.FileSystemFinder",
    "django.contrib.staticfiles.finders.AppDirectoriesFinder"
)

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates/'),
                 os.path.join(BASE_DIR, 'static').replace('\\', '/')],
        # 修改行'DIRS': []
        # 后面还有代码，没动，就不粘上去了

2.创建common_static文件夹，可以放js等静态文件

（common_static文件夹的作用：可以在 settings.py 中指定所有 app 共用的静态文件，放在common_static文件夹）

对应的setting.py语句：

settings.py 中os.path.join(BASE_DIR, "common_static")

 

3.终端运行：python manage.py collectstatic

作用：部署静态文件，将所有的静态文件归到collect_static文件夹中

（这一句话就会把以前放在app下static中的静态文件全部拷贝到 settings.py 中设置的 STATIC_ROOT 文件夹中）

对应的setting.py语句：

STATIC_ROOT = os.path.join(BASE_DIR, 'collect_static')

 

4.得到下面的目录

我在common_static中放了j s文件，在app的static文件夹中放了jpg文件。

执行了第三步的python manage.py collectstatic语句后，可以看到文件都归纳到了collect_static文件夹中。

5.设置urls文件

在末端添加两句话

from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
#设置静态文件路径

6.html中测试（js文件和img文件）

一定要加

{% load static %}

 {% load static %}
<script type="text/javascript" src="{% static 'js/jquery-3.5.1.min.js' %}"></script>
<img src="{% static 'pic/example.jpg' %} ">
 <link rel="stylesheet" href="/static/css/main.css"/>

这样写路径就可以在前端调用静态文件了。