Django Tailwind 项目教程

Django Tailwind 项目教程

django-tailwindDjango + Tailwind CSS = 💚项目地址:https://gitcode.com/gh_mirrors/dj/django-tailwind

1. 项目的目录结构及介绍

Django Tailwind 项目的目录结构遵循标准的 Django 项目结构，并添加了一些特定于 Tailwind CSS 的文件和目录。以下是一个典型的目录结构示例：

myproject/
├── manage.py
├── myproject/
│   ├── __init__.py
│   ├── settings.py
│   ├── urls.py
│   ├── wsgi.py
├── tailwind_app/
│   ├── __init__.py
│   ├── apps.py
│   ├── templates/
│   │   └── base.html
│   ├── static/
│   │   └── css/
│   │       └── tailwind.css
│   ├── tailwind.config.js
├── requirements.txt

目录结构介绍

• manage.py: Django 项目的命令行工具。
• myproject/: 项目的主配置目录。
  • settings.py: 项目的配置文件。
  • urls.py: 项目的 URL 路由配置。
• tailwind_app/: 包含 Tailwind CSS 相关文件的应用目录。
  • templates/: 存放 HTML 模板文件。
  • static/: 存放静态文件，如 CSS 文件。
  • tailwind.config.js: Tailwind CSS 的配置文件。

2. 项目的启动文件介绍

Django Tailwind 项目的启动文件主要是 manage.py 和 wsgi.py。

manage.py

manage.py 是 Django 项目的命令行工具，用于执行各种管理任务，如启动开发服务器、运行迁移、创建超级用户等。

python manage.py runserver

wsgi.py

wsgi.py 是 Django 项目的 WSGI 应用程序入口点，用于在生产环境中部署项目。

import os
from django.core.wsgi import get_wsgi_application

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'myproject.settings')
application = get_wsgi_application()

3. 项目的配置文件介绍

Django Tailwind 项目的配置文件主要包括 settings.py 和 tailwind.config.js。

settings.py

settings.py 是 Django 项目的主配置文件，包含数据库配置、静态文件配置、应用安装等设置。

INSTALLED_APPS = [
    # 其他 Django 应用
    'tailwind',
    'theme',
    'django_browser_reload',
]

MIDDLEWARE = [
    # 其他中间件
    "django_browser_reload.middleware.BrowserReloadMiddleware",
]

# Tailwind CSS 配置
TAILWIND_APP_NAME = 'theme'
INTERNAL_IPS = [
    '127.0.0.1',
]

tailwind.config.js

tailwind.config.js 是 Tailwind CSS 的配置文件，用于自定义 Tailwind CSS 的行为和样式。

module.exports = {
  purge: [
    './tailwind_app/templates/**/*.html',
    './tailwind_app/static/css/**/*.css',
  ],
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [],
}

以上是 Django Tailwind 项目的基本教程，涵盖了项目的目录结构、启动文件和配置文件的介绍。希望这些内容能帮助你更好地理解和使用 Django Tailwind 项目。

django-tailwindDjango + Tailwind CSS = 💚项目地址:https://gitcode.com/gh_mirrors/dj/django-tailwind