Installation
Install django-tailwind-cli
- Install the library.
python -m pip install django-tailwind-cli
with optional django-extensions
and Werkezeug
libraries to use the runserver_plus
command.
python -m pip install django-tailwind-cli[django-extensions]
- Add
django_tailwind_cli
toINSTALLED_APPS
insettings.py
.
INSTALLED_APPS = [
# other Django apps
"django_tailwind_cli",
]
If you plan to use the runserver_plus
command, the changes to INSTALLED_APPS
looks like that.
INSTALLED_APPS = [
# other Django apps
"django_tailwind_cli",
"django_extensions,
]
- Configure the
STATICFILES_DIRS
parameter in yoursettings.py
if not already configured.
STATICFILES_DIRS = [BASE_DIR / "assets"]
- Add template code.
{% load tailwind_cli %}
...
<head>
...
{% tailwind_css %}
...
</head>
- Start the debug server or start the Tailwind CLI in watch mode.
python manage.py tailwind runserver
Or
python manage.py tailwind runserver_plus
Or
python manage.py tailwind watch
If you only start the Tailwind CLI in watch mode, you have to start the debug server with the standard command python manage.py runserver
seperately.
Optional steps
Install django-browser-reload
If you enjoy automatic reloading during development. Install the django-browser-reload app. The following installation steps are taken from the README of the project.
- Install
django-browser-reload
inside your Django project.
python -m pip install django-browser-reload
-
Ensure you have
django.contrib.staticfiles
in yourINSTALLED_APPS
. -
Add
django_browser_reload
app to yourINSTALLED_APPS
.
INSTALLED_APPS = [
...,
"django_browser_reload",
...,
]
- Include the app URL’s in your root URLconf(s).
from django.urls import include, path
urlpatterns = [
...,
path("__reload__/", include("django_browser_reload.urls")),
]
- Add the middleware.
MIDDLEWARE = [
# ...
"django_browser_reload.middleware.BrowserReloadMiddleware",
# ...
]
The middleware should be listed after any that encodes the response, such as Django’s GZipMiddleware.
The middleware automatically inserts the required script tag on HTML responses before