• [Django基础] django解决静态文件依赖问题以及前端引入方式


    一、静态文件依赖

    学习django的时候发现静态文件(css,js等)不能只在html中引入,还要在项目的settings中设置,否则会报以下错误

    [11/Sep/2018 03:18:15] "GET /static/js/index.js HTTP/1.1" 404 1646
    [11/Sep/2018 03:18:15] "GET /static/js/lib/vue/dist/vue.js HTTP/1.1" 404 1679
    [11/Sep/2018 03:18:15] "GET /static/js/lib/jquery/dist/jquery.js HTTP/1.1" 404 1697
    [11/Sep/2018 03:18:15] "GET /static/css/bootstrap/dist/js/bootstrap.js HTTP/1.1" 404 1715
    [11/Sep/2018 03:18:15] "GET /static/css/bootstrap/dist/js/bootstrap.js HTTP/1.1" 404 1715
    [11/Sep/2018 03:18:15] "GET /static/js/lib/vue/dist/vue.js HTTP/1.1" 404 1679
    [11/Sep/2018 03:18:15] "GET /static/js/index.js HTTP/1.1" 404 1646

    具体引入方法如下(静态文件均存放在static下):

    1.INSTALLED_APPS

    INSTALLED_APPS = [
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
    ]

    2.STATIC_URL 

    STATIC_URL = '/static/'

    3.STATICFILES_DIRS

    STATICFILES_DIRS = [(os.path.join(BASE_DIR,'static'))] #这里必须是list或者tuple格式

    引入后重新加载:

    [11/Sep/2018 03:22:11] "GET / HTTP/1.1" 200 522
    [11/Sep/2018 03:22:11] "GET /static/js/lib/jquery/dist/jquery.js HTTP/1.1" 200 271751
    [11/Sep/2018 03:22:11] "GET /static/js/index.js HTTP/1.1" 200 1966
    [11/Sep/2018 03:22:11] "GET /static/css/bootstrap/dist/js/bootstrap.js HTTP/1.1" 200 123765
    [11/Sep/2018 03:22:11] "GET /static/js/lib/vue/dist/vue.js HTTP/1.1" 200 289303

    二、前端引入方式有二:

    1.{%static%}方式   

    在页面的较上处写:
    {% load staticfiles %}
    
    在 link script 等src 写 : {%static 'xxx.css'%}  {%static 'xxx.js'%}

    2./static/..方式

    在 link script 等src 写 :
    /static/xxx.cs

    两者可混用,但不推荐


    DONE。

  • 相关阅读:
    linux----安装jdk
    docker安装gitlab
    Centos7 安装docker
    容易混淆的字符
    nodejs 简单从淘宝的有好货根据关键词获取列表以及详情
    bash设置终端提示符
    C# NuGet打包和离线安装
    Shell 遍历文件夹中所有文件并进行相关操作
    css中“~”和“>”
    双击编辑表格字段
  • 原文地址:https://www.cnblogs.com/halleluyah/p/9626515.html
Copyright © 2020-2023  润新知