Django 不会在 VS Code 编辑器中解析静态文件的路径
Django won't resolve path to static file inside VS Code editor
我的 html 文件顶部的 {% load static %} 标签似乎有效
但是当我尝试使用以下代码从静态文件夹中 link 我的 css 文件时:
{% load static %}
<link href="{% static 'static/style.css' %}" rel="stylesheet">
vscode 尝试在我的模板目录中创建一个名为 {% static 'static/style.css' %} 的文件,这意味着无法识别 static 关键字。
任何有助于找出原因的帮助将不胜感激(底部路径的屏幕截图)
这是我的 settings.py 到 link 静态文件
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
STATIC_URL = '/static/'
STATICFILES_DIRS = [
BASE_DIR / "static",
'/Google_Solutions/static/',
]
我的静态和模板在主目录中
这是我的 home.html 文件头,我试图在其中包含文件
{% extends 'layout.html' %}
{% load static %}
{% block head %}
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title> Homepage </title>
<!-- Template Main CSS File -->
{% load static %}
<link href="{% static 'css/style.css' %}" rel="stylesheet">
{% endblock %}
这是我的 layout.html
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="icon" type="image/png" sizes="16x16" href="{% static '/favicon-16x16.png'%}">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
{% block head %}
{% endblock %}
</head>
<body>
{% block body %}
{% endblock %}
</body>
<script type="text/javascript" src="{% static 'js/app.js' %}"></script>
所以我发现了错误,它只是我的本地 vscode
即使悬停 link 显示了错误的地址,只要您的语法正确,您的静态文件就可以正常加载。通过启动你的服务器来检查它
我的 html 文件顶部的 {% load static %} 标签似乎有效
但是当我尝试使用以下代码从静态文件夹中 link 我的 css 文件时:
{% load static %}
<link href="{% static 'static/style.css' %}" rel="stylesheet">
vscode 尝试在我的模板目录中创建一个名为 {% static 'static/style.css' %} 的文件,这意味着无法识别 static 关键字。
任何有助于找出原因的帮助将不胜感激(底部路径的屏幕截图)
这是我的 settings.py 到 link 静态文件
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
STATIC_URL = '/static/'
STATICFILES_DIRS = [
BASE_DIR / "static",
'/Google_Solutions/static/',
]
我的静态和模板在主目录中
这是我的 home.html 文件头,我试图在其中包含文件
{% extends 'layout.html' %}
{% load static %}
{% block head %}
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title> Homepage </title>
<!-- Template Main CSS File -->
{% load static %}
<link href="{% static 'css/style.css' %}" rel="stylesheet">
{% endblock %}
这是我的 layout.html
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="icon" type="image/png" sizes="16x16" href="{% static '/favicon-16x16.png'%}">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
{% block head %}
{% endblock %}
</head>
<body>
{% block body %}
{% endblock %}
</body>
<script type="text/javascript" src="{% static 'js/app.js' %}"></script>
所以我发现了错误,它只是我的本地 vscode
即使悬停 link 显示了错误的地址,只要您的语法正确,您的静态文件就可以正常加载。通过启动你的服务器来检查它