静态文件未从静态文件夹加载

2024-06-08 08:47:03 发布

您现在位置：Python中文网/ 问答频道 /正文
3102 3

我正在构建一个博客应用程序，我遇到了一个问题

问题

Static Files未从static folder加载。有些文件正在加载，但有些文件未加载

我做了什么？

url.py

我还把static url放在url.py中，它对我也不起作用

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

settings.py

os.path.join(BASE_DIR, "static", "static")

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),

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

my_template.html

    {% load static %}

   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" />
    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Next Level - Gallery</title>
    <!--
    Next Level CSS Template
    https://templatemo.com/tm-532-next-level
    -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" />



    <script src="{% static 'comments/all.min.css' %}"></script>

    <script src="{% static 'comments/bootstrap.min.css' %}"></script>

    <script src="{% static 'comments/templatemo-style.css' %}"></script>

      </head>
          <div class="row tm-welcome-row">
            <div class="col-12">
              <div
                class="tm-welcome-parallax tm-center-child"
                data-parallax="scroll"
                data-image-src="static/images/blooming-bg.jpg"
              >
                <div class="tm-bg-black-transparent tm-parallax-overlay">
                  <h2>Our Gallery</h2>
                  <p>this is a parallax background image</p>
                </div>
              </div>
            </div>
          </div>

              <div class="tm-page-col-right">
                <div class="tm-gallery" id="tmGallery">
                  <div class="tm-gallery-item category-1">
                    <figure class="effect-bubba">
                      <img
                        src="static/comments/gallery/gallery-item-01.jpg"
                        alt="Gallery item"
                        class="img-fluid"
                      />
                    </figure>
                  </div>
                </div>
              </div>
            </div>
          </section>

    <script src="{% static 'comments/jquery.min.js' %}"></script>
    <script src="{% static 'coments/parallax.min.js' %}"></script>
    <script src="{% static 'comments/imagesloaded.pkgd.min.js' %}"></script>
    <script src="{% static 'comments/isotope.pkgd.min.js' %}"></script>
    <script src="{% static 'comments/bootstrap.min.js' %}"></script>

        <script>
          $(function() {
            /* Isotope Gallery */

            // init isotope
            var $gallery = $(".tm-gallery").isotope({
              itemSelector: ".tm-gallery-item",
              layoutMode: "fitRows"
            });
            // layout Isotope after each image loads
            $gallery.imagesLoaded().progress(function() {
              $gallery.isotope("layout");
            });

            $(".filters-button-group").on("click", "a", function() {
              var filterValue = $(this).attr("data-filter");
              $gallery.isotope({ filter: filterValue });
              console.log("Filter value: " + filterValue);
            });

            /* Tabs */
            $(".tabgroup > div").hide();
            $(".tabgroup > div:first-of-type").show();
            $(".tabs a").click(function(e) {
              e.preventDefault();
              var $this = $(this),
                tabgroup = "#" + $this.parents(".tabs").data("tabgroup"),
                others = $this
                  .closest("li")
                  .siblings()
                  .children("a"),
                target = $this.attr("href");
              others.removeClass("active");
              $this.addClass("active");

              // Scroll to tab content (for mobile)
              if ($(window).width() < 992) {
                $("html, body").animate(
                  {
                    scrollTop: $("#tmGallery").offset().top
                  },
                  200
                );
              }
            });
          });
        </script>
      </body>
    </html>

我试过什么

  • 我还尝试了python manage.py collectstatic，结果显示0 static files copied to 'D:\myapp\static_cdn', 248 unmodified.

我尝试了很多答案，其中一些人说add static url在url.py`中，但它不起作用

我不知道该怎么办

任何帮助都将不胜感激

先谢谢你


Tags： pydivsrcurlhtmlscriptstaticgallery
1条回答
网友
1楼 · 发布于 2024-06-08 08:47:03

确保settings.py具有以下内容

设置.py

from pathlib import Path
import os

# Build paths inside the project like this: BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR,"templates")
STATIC_DIR = os.path.join(BASE_DIR,"static")
MEDIA_DIR = os.path.join(BASE_DIR, 'media')

下面的部分最好在底部

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.1/howto/static-files/

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    STATIC_DIR,
]

#MEDIA
MEDIA_ROOT = MEDIA_DIR
MEDIA_URL = '/media/' 


LOGIN_URL = 'user_login'

enter image description here

enter image description here

现在在基本目录（manage.py所在的位置）中创建一个名为static的文件夹，并将静态文件放在其中

请确保在模板中{%load static%}

如果没有任何效果，尝试打开一个新项目，然后尝试上述方法

相关问题 更多 >

    编程相关推荐