全网最新！Django + Tailwind CSS + DaisyUI 快捷安装教程

原创

已于 2025-08-06 14:34:45 修改 · 1.4k 阅读

18 ·

CC 4.0 BY-SA版权

文章标签：

#django #css #python #pycharm #node.js #个人开发

于 2025-07-21 15:11:20 首次发布

现在互联网上很少有 Django + Tailwind CSS + DaisyUI 的详细安装教程，即使有也已经过时，不适用现在的最新版本。为了实现这个组合我踩了不少坑，现在将自己总结的经验分享给大家，如果能帮到你希望能给一个赞和评论

首选确保自己的 Nodejs 已安装，使用下面的指令可以查看对应版本：

# 查看nodejs版本
node -v

# 查看npm版本
npm -v

本次教程所使用的环境如下，仅供参考：

Nodejs：v22.17.1，NPM：10.9.2
Python：3.10.6，Pip：23.2.1
Django：5.2.4，TailwindCSS：4.1.11，daisyUI：

所参考官方文档指路：

第一部分：安装 Django（基础准备）

在开始集成 Tailwind 和 DaisyUI 之前，我们需要先确保 Django 环境已准备就绪。如果已有 Django 项目，可跳过此步骤直接进入第二部分。

方法 1：通过指令安装

创建虚拟环境（推荐）

创建虚拟环境可以隔离依赖版本，虚拟环境为每个项目单独管理依赖，能有效防止版本冲突：

# 创建虚拟环境
python -m venv venv

# 激活虚拟环境
# Windows（命令提示符）
venv\Scripts\activate

# Windows（PowerShell）
.\venv\Scripts\Activate.ps1

# Mac/Linux
source venv/bin/activate

安装 Django

通过 pip 直接安装：

pip install django

创建 Django 项目

使用 django-admin 直接创建，创建后进入自己的项目

django-admin startproject myproject


cd myproject

自动创建的目录结构如下

验证 Django 安装成功

启动Web服务，会自动监听在8000端口：

python manage.py runserver

访问 http://127.0.0.1:8000，看到 Django 欢迎页面即表示安装成功

方法 2：通过 Pycharm 创建

创建 Django 项目

在 Pycharm 新建一个项目，项目类型选择 Django，输入项目名并勾选使用虚拟环境创建

创建完后生成的项目结构如下

验证 Django 安装成功

创建完后直接点击右上角运行按钮便可以启动 Web 服务，自动监听于 8000 端口

第二部分：通过 django-tailwind-4 安装 Tailwind CSS

django-tailwind-4 是专为 Django 设计的 Tailwind 集成工具，能自动处理配置、编译等繁琐工作，特别适合新手使用，我们便通过它来快速安装 Tailwind CSS

官方安装文档：Installation - django-tailwind-4 0.1.4 documentation

步骤 1：安装 django-tailwind-4

直接通过 pip 进行安装：

pip install django-tailwind-4

如果我们是在 Pycharm 中安装，则点击底部终端按钮新建一个本地 cmd 终端，然后输入 pip 安装指令，后续指令也都可以通过这个窗口输入执行

步骤 2：配置 Django 项目

注册 Tailwind 应用

打开 myproject/settings.py，在 INSTALLED_APPS 中添加 'tailwind'：

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'tailwind',			# 添加此行
]

创建 Tailwind 专用应用

运行命令创建一个名为 theme 的应用（用于存放 Tailwind 相关配置）：

python manage.py tailwind init

运行指令时会出现输入提示，让我们输入创建的应用名称，直接回车使用默认的 theme 名称就行

执行完整指令后，会在当前项目下面新建一个 theme 应用目录，其中 tailwind.config.js 用于配置 Tailwind CSS，这个文件很重要，后面会用到

注册主题应用

再次修改 settings.py，添加刚创建的 theme 应用，并注册 Tailwind 应用名称：

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